Bootstrap Multi select搜索清除按钮单击事件不起作用

Question

我正在使用带有搜索启用选项的引导多重选择器。

我试图在单击X按钮时取消选择所有选定的项目。但我无法处理此按钮的单击事件。

请帮助或提出更好的方法。

这是示例代码：

<select id="multiselect-users" name="users[]" multiple="multiple">
    <option value="1">User1</option>
    <option value="2">User2</option>
</select>

<script type="text/javascript">
 $('#multiselect-users').multiselect({
    enableFiltering: true
 });
  // .multiselect-clear-filter is X button class. This button is part of bootstrape-multiselect if you enable filter
 $(document).on('click', '.multiselect-clear-filter', function(){

    // not working :(
    alert('test');
 });
</script>

单击此X按钮，我要取消选择所有选定的项目。

Answer 1

您真正期望的是，当您单击select option时会显示警报。

但此事件的名称不称为“单击”，称为“更改”：

     $(document).on('change', '#multiselect-users', function(){
    
    	// woking :)
    	alert('test');
     });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="multiselect-users" name="users[]" multiple="multiple">
     	<option value="1">User1</option>
     	<option value="2">User2</option>
    </select>

此外，您应该将此事件添加到select标记中，而不要添加到.multiselect-clear-filter中。

我必须说些有关：

 $('#multiselect-users').multiselect({
    enableFiltering: true
 });

部分。启用此功能后，change事件将不起作用。但我认为此功能可能来自另一个库。

希望这会有所帮助！

Answer 2

嗨，您也可以尝试此选项

 $('#multiselect-users').multiselect({
        includeFilterClearBtn:true
 });