Question

我使用了由davidstutz创建的Bootstrap multiselect。

我启用了多选，并且也选中了所有复选框，但是当我选中复选框时，它会被选中，但下拉不会像单选一样关闭。这对我来说是一个非常具体的要求。

如何像正常选择框一样关闭每个选项的下拉列表？

HTML：

<select multiple="multiple" data-placeholder="Select" 
        multiselect-dropdown="reportListDropdown" ng-model="reports.reportList"
        ng-options="replist.id as replist.name for replist in reports.reportListArr">
</select>

答案：

 272:  if (this.options.multiple) {
 273:      // Simply select additional option.
 274:      $option.prop('selected', true);
+275:      this.$button.click();
       }

我在第275行以及bootstrap-multiselect.js的else部分添加了this.$button.click();代码，它运行正常，但编辑核心文件并不是真正的解决方案，所以任何人都知道一个干净的方式处理财产或期权水平？

Answer 1

要从jQuery中关闭Bootstrap MultiSelector ，我发现只需点击任何其他对象即可使用本机功能关闭它。因此，这有效：

$(document).click();

以下是迭代已检查的MultiSelect项目然后关闭 MultiSelect的示例：

$('#foo').on("change", '[name="bar\\[\\]"]', function() {

    $('[name="bar\\[\\]"]:checked').each(function(){
        console.log( $(this).val() );
    });

    $(document).click(); // This closes the MultiSelector
});

Answer 2

我找到了另一个解决方案（在我看来更好：D）我注意到当下拉菜单打开时，名为＆＃39; open＆＃39;被附加到div容器。因此，要关闭下拉列表，只需删除该类。你可以这样做：

var $ = require('jQuery');
$.ajax({
    type: 'POST',
    url: endpoint + token,
    contentType: 'application/json',
    data: JSON.stringify(body),
    success: function(data, status) {
        console.log(data);
        console.log(status);
    },
    error: function(jqXHR, status, errorThrown) {
        console.log(errorThrown);
        console.log(status);
        console.log(jqXHR);
    }
});

Answer 3

.multiselect({
    onChange: function(option, checked) {
        this.$container.removeClass('open');
    }
});

Bootstrap multiselect：每个复选框选择的关闭下拉列表

3 个答案: