Question

我有一个“城市”多个选择列表框，其中包含：

1 - 第一项是“所有城市”

2 - 剩余项目是所选国家/地区的城市

我正在尝试实现以下行为：

1 - 当选择第一个项目（“所有城市”）时，取消选择任何其他项目（取消选择已经选择的任何城市项目）

2 - 如果选择了除第一个项目以外的任何项目（选择了城市），则取消选择第一个项目（如果已选中）（但不取消选择任何其他选定的城市）

我尝试过处理onChange - 但我不知道如何获取最后选择的项目。

任何帮助表示感谢。

Answer 1

好的，所以我假设说“多选列表框”是指<select multiple>元素。

然后我们走了......

您提到的第一个行为不需要任何操作，因为当您单击未按CTRL (or CMD in Mac)的其他选项时，此类选择的默认操作将取消选中所有选项。

对于第二个，您必须侦听select元素中的更改，然后验证是否已选择选项AllCities以及是否选择了其他options。< / p>

所以代码我会喜欢......

你有HTML：

<select id="cities" multiple>
    <option value="All" selected>All Cities</option>
    <option value="A">City A</option>
    <option value="B">City B</option>
    <option value="C">City C</option>
</select>

监听更改的脚本并检查是否选择了选项All以及是否还选择了其他选项：

$('#cities').on('change',function(){
    var it = $(this);
    if(it.val().indexOf("All") > -1 && it.val().length > 1){
        $('option[value="All"]',it).prop('selected',false);
    }
});

Here is a fiddle显示其行为。

jquery multiple select - 如何在选择项目时收到通知，并知道选择了哪个项目

1 个答案: