javascript - 单击 SelectAllOption 多选时未触发 onChange 事件

Question

我使用 bootstrap multiselect ，根据所选选项获取数据。此过滤器数据将在 onChange 触发时起作用，但在尝试选择所有 onChange 时不起作用:

function getOptions(node, isFilter) {
    var isChanged = false;
    return {
        enableCaseInsensitiveFiltering: isFilter,
        includeSelectAllOption: true,
        filterPlaceholder: 'Search ...',
        nonSelectedText: node,
        numberDisplayed: 1,
        buttonWidth: '100%',
        maxHeight: 400,
        onChange: function () {
            alert('Changes');
            isChanged = true;
        },
        onDropdownHide: function (event) {
            if (isChanged) {
                filterData(node);
                isChanged = false;
            }

        }
    }
}
$('#myselect').multiselect(getOptions('myselect', true));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.13/js/bootstrap-multiselect.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.13/css/bootstrap-multiselect.css" />
<!-- Build your select: -->
<select id="myselect" multiple="multiple">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
    <option value="4">Option 4</option>
    <option value="5">Option 5</option>
    <option value="6">Option 6</option>
</select>

Answer 1

Bootstrap multiselect 提供了一个名为“onSelectAll”的函数。此功能将用于选择所有选项。您需要将 onSelectAll 函数与 onChange 函数一起使用。

function getOptions(node, isFilter) {
var isChanged = false;
return {
    enableCaseInsensitiveFiltering: isFilter,
    includeSelectAllOption: true,
    filterPlaceholder: 'Search ...',
    nonSelectedText: node,
    numberDisplayed: 1,
    buttonWidth: '100%',
    maxHeight: 400,
    onChange: function () {
        isChanged = true;
    },
    onSelectAll: function() {
        isChanged = true;
    },
    onDropdownHide: function (event) {
        if (isChanged) {
            filterData(node);
            isChanged = false;
        }

    }
}
}
$('#DDLCity').multiselect(getOptions('City', true));