【问题标题】:Refresh Jquery multi chosen select刷新 Jquery 多选选择
【发布时间】:2016-09-27 02:26:22
【问题描述】:

点击重置按钮后如何从jquery多选中删除选定的项目?

<select data-placeholder="Select" id="options" class="chosen-select" maxwidth="50px" multiple tabindex="15" ></select> 

我尝试了几种方法都没有运气。这是我的代码:

    $("#options").multiselect('refresh');
    $("#options").multiselect('clearSelection');
    $('#options').multiSelect('deselect_all');
    $("#options").find('option:selected').removeAttr("selected");

上图后仍然显示选中的项目,

任何帮助将不胜感激。

【问题讨论】:

  • 该屏幕截图看起来不像多选 - 它看起来像已选择 (harvesthq.github.io/chosen) 或 tagit (aehlke.github.io/tag-it)...您是否 100% 确定正在使用哪个库?编辑:实际上基于类,它是一个选定的字段...使用.chosen() 方法,或将属性设置为false(即$("#options").find('option:selected').prop('selected',false)),而不仅仅是删除属性;然后触发更新:$("#options").trigger('chosen:updated');

标签: jquery reset multi-select jquery-chosen


【解决方案1】:

这不是多选,它是一个 jQuery 选择字段,看起来像。这里的答案涵盖了你:'select all' and 'remove all' with chosen.js - 只需从选项中删除选定的属性,然后更新选定的元素

$("#options").find('option:selected').prop('selected',false);
$("#options").trigger('chosen:updated');

如果您使用的是旧版本的 selected,那么正确的触发器可能是:liszt:updated,例如。

$("#options").trigger('liszt:updated');

但是您需要在问题中添加该细节,以便我确定。

顺便说一句,如果您还将此初始化为多选,我预测您将来会遇到问题。我会确定你想使用哪个小部件,并确保你只将它初始化/调用它作为那个小部件的方法,并且只使用那个小部件

【讨论】:

  • 是的,它是 Jquery 选择了多个,但这个答案对我不起作用。选定的项目仍然存在。
  • 那么我建议您可能会遇到与将其初始化为两种不同类型的小部件有关的问题。第一行是在选择列表中取消选择所有选项的可接受方式 (stackoverflow.com/questions/1857781/…) 第二行是更新其选项已更新的选定小部件的可接受方式 (harvesthq.github.io/chosen/options.html#triggerable-events)。您可能还使用了一个过时的版本,如果我没记错的话,它有不同的触发器。您需要在问题中添加更多信息以获得帮助。
  • 但要明确的是,如果您调用以 $('#options').multiSelect(... 开头的任何内容,那么我希望您不会有任何效果 - multiSelect 方法不适用于选定的字段,并且可能会导致问题字段。
【解决方案2】:

我对多选不太熟悉,但根据docs 看来您可以使用以下方法取消全选:

$('#your-select').multiSelect('deselect_all');

【讨论】:

    【解决方案3】:

    你可以使用:

    $("#options").find('option:selected').removeAttr("selected");
    

    示例:https://jsfiddle.net/hs9yft2n/1/

    【讨论】:

      猜你喜欢
      • 2012-03-11
      • 1970-01-01
      • 2016-06-08
      • 2016-06-11
      • 1970-01-01
      • 1970-01-01
      • 2013-03-11
      • 2022-06-17
      • 1970-01-01
      相关资源
      最近更新 更多