javascript - 使用 Shift 键时如何限制选择元素中的选定选项

Question

HTML

<select id="my-select" multiple="multiple" size="8" style="width:200px">
    <option value="0">0</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
    <option value="10">10</option>
    <option value="11">11</option>
    <option value="12">12</option>
    <option value="13">13</option>
    <option value="14">14</option>
    <option value="15">15</option>
</select>

JQUERY

$('#my-select option').on('click',function(){
    var count = $('#my-select').find('option:selected').length;
    $('#dg').html(count);
        if(count>10){
            $(this).attr('selected',false); 
    alert('limit 10');
         }
 });

http://jsfiddle.net/LxNMm/

当您单击选项时，计算所选选项的数量并将其限制为 10，但是如果您按住 Shift 键单击选项并选择一个范围，则选择可能会大于 10。如何检测按 Shift 键选择范围时选择的选项

Answer 1

您可以尝试通过以下方式更新值:

 $('#my-select').on('change', function () {
    var count = $(this).find('option:selected').length;
    $('#dg').html(count);
    if (count > 10) {
       $('option:gt(9)', this).attr('selected', false);
       count = $(this).find('option:selected').length;
       $('#dg').html(count);
       alert('error');
    }
});

Your updated demo fiddle