limit Несколько Выберите несколько

Question

Amm Guys Пожалуйста, помогите мне. У меня есть 3 select multiple. и я хочу ограничить выбранные параметры в каждом выбранном множителе с разным лимитом. например, при первом выборе, я хочу ограничить его только двумя выбранными параметрами. Во втором выборе я хочу ограничить его только 4 выбранными параметрами. при третьем выборе я хочу ограничить его только тремя выбранными параметрами. прости. им новый это. пожалуйста помогите. спасибо

// total option that can be selected for this should be 2 
<select multiple class='qwerty' size = "3" style = "width:10%;"> 
<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> 
</select> 

// total option that can be selected for this should be 4 
<select multiple class='qwerty' size = "3" style = "width:10%;"> 
<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> 
</select> 

// total option that can be selected for this should be 3 
<select multiple class='qwerty' size = "3" style = "width:10%;"> 
<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> 
</select> 


       <script src="jquery.min.js"></script> 
        <script language = "JavaScript"> 
         var last_valid_selection = null; 
         $('.qwerty').change(function(event) { 
          if ($(this).val().length > 2) { 
           alert('You can only choose 2!'); 
           $(this).val(last_valid_selection); 
          } else { 
           last_valid_selection = $(this).val(); 
          } 
         }); 
        </script> 
      </script> 

Answer 1

Вы можете использовать the data API получить data- атрибут, связанный с элементом. Я предполагаю, что атрибут size, который вы написали, служит этой цели.

<select multiple class='qwerty' data-size="3" style="width:10%;"> 

Вы должны изолированные last_valid_selection для каждого из select элемента. Это может быть достигнуто путем создания замыкания, которое захватывает внешнюю переменную.

<script src="jquery.min.js"></script> 

<script type="text/javascript"> 
    $('.qwerty').change((function() { 
     var last_valid_selection = null; // closure variable private to each of the select element 
     return function(event) { 
      var limit = parseInt($(this).data('size')); // data API to get the attribute data-size 
      if ($(this).val().length > limit) { 
       alert('You can only choose ' + limit + '!'); 
       $(this).val(last_valid_selection); 
      } else { 
       last_valid_selection = $(this).val(); 
      } 
     }; 
    })()); 
</script> 

См., Например, jsFiddle.