当取消选择最后一项时，多个 <select> 更改事件未触发

Question

我正在使用 jQuery 在多选上注册更改事件，以在多选下方的 span 元素中显示所选值。选择和取消选择列表中的元素时，更改事件会正常触发，除非我取消选择最后一个选定的元素。

<select id="multiselect" multiple>
    <optgroup label="Italian">
        <option value="CEI2008">CEI2008 — Conferenza Episcopale Italiana (2008)</option>
        <option value="LUZZI">LUZZI — Riveduta - Luzzi (1924)</option>
    </optgroup>
    <optgroup label="Latin">
        <option value="NVBSE">NVBSE — Nova Vulgata - Bibliorum Sacrorum Edition (1979)</option>
    </optgroup>
</select>
<div>Selected versions: <span id="selectedversions">none</span></div>

和随附的 jquery 代码：

$('#multiselect').change(function(){
    var selecteditems = $(this).val();
    if(selecteditems.length===0){ $('#selectedversions').text('none'); }
    else{ $('#selectedversions').text(selecteditems.join(',')); }
});

当按住 CTRL 并单击取消选择最后一个项目时，我希望触发更改事件并且 jquery val() 到 return 一个空数组。相反，在取消选择最后一个选定项目的情况下，更改事件似乎根本没有触发。

Answer 1

经过一些调试，我实际上找到了自己的答案。

change 事件确实会触发，但是 jquery val() returns "null"，当没有选择任何元素时，不是一个空数组。与 null 进行比较就足以使其正常工作：

$('#multiselect').change(function(){
    var selecteditems = $(this).val();
    if(selecteditems===null){ $('#selectedversions').text('none'); }
    else{ $('#selectedversions').text(selecteditems.join(',')); }
});

Answer 2

对我来说 jQuery 由于互联网连接不佳而无法正确加载。如果您遇到同样的问题，请使用 DOM level.

$(document).on('change','#multiselect',function() {
    var value = $('#multiselect').val();
    alert(value);
});

当取消选择最后一项时，多个 <select> 更改事件未触发

multiple <select> change event not firing when last item is deselected

jquery

select

onchange

multi-select

deselect