Bootstrap 5+jQuery：基于其他多选框控制多选框的启用禁用与全取消

问题原因 #

你的代码存在两个关键问题：

• 选择器语法错误：$('#ddlCities"') 多了一个多余的引号，导致deselectAll方法未被执行，副框选中项无法清除。
• deselectAll参数设置错误：第二个参数传false仅修改DOM选中状态，不会触发插件UI更新，界面仍显示选中状态。

修复后的代码 #

$('#ddlCountry').on('change', function () {
    if ($('#ddlCountry option[value=620]:selected').length > 0) {
        $('#ddlCities').multiselect('enable');
    } else {
        // 修正选择器，同时传true触发UI同步更新
        $('#ddlCities').multiselect('deselectAll', true);
        $('#ddlCities').multiselect('disable');
    }
});

额外说明 #

• 必须保证deselectAll在disable之前执行：部分多选插件在禁用状态下无法修改选中状态，先完成取消选中操作再禁用是必要的。
• 若需要清除主框所有选中项，可在else分支中添加$('#ddlCountry').multiselect('deselectAll', true);。

内容的提问来源于stack exchange，提问作者John Butler