防止多重选择检查最后的值

Question

我希望实现多个select元素，以防止用户检查列表中的所有值(all -1是可以接受的)。我编写了一些jquery代码，但我不知道它有什么问题。有什么帮助吗？HTML：

<select class='custom-header' id='custom-header' multiple='multiple' name="my-select">
     <option class="test" value='elem_1'>elem 1</option>
     <option  class="test" value='elem_2'>elem 2</option>
     <option class="test" value='elem_3'>elem 3</option>
     <option class="test" value='elem_4'>elem 4</option>
     <option value='elem_100'>elem 100</option>
</select>

联署材料：

var userChoice = $(".test");
$.each(userChoice, function(index,value){
   if(index = userChoice.length -1){
      alert("The last was clicked.");
   }
});

Answer 1

尝试此操作，它将阻止您选择所有选项：

$("#custom-header").change(function () {
    if ($(this).val().length > 4) {
        $(this).val("");
    }
});

更新小提琴

或者如果你喜欢短三元：

$("#custom-header").change(function () {   
    $(this).val($(this).val().length > 4 ? "" : $(this).val());
});

Answer 2

使用此代码，当选中所有选项时，您将得到警报。

   $('#custom-header').change(function(){
if($("#custom-header > option").length==$("#custom-header    :selected").length){
  alert("The last was clicked.");
}
});

Answer 3

您可以使用最后一个孩子选择器：

 var userChoice = $(".test:last-child");
 userChoice.on('click', function() {
         // stuff;
 });

如果您使用onchange事件会更好。

  $('#custom-header').on('change', function() {
       if($(this).selectedIndex == $('#custom-header .test').length)
  });