флажок установлен только флажок

Question

У меня есть динамически установленный флажок. У меня установлен только флажок максимум 3. Однако, если установлен четвертый флажок, его следует пропустить. а также сняли четвертый флажок. моя проблема в том, что все флажки сняты.

   $(document).ready(function(){
     $(":checkbox").change(function() {
     if(this.checked) {
    var numberOfChecked = $('input:checkbox:checked').length;
     if(numberOfChecked > 3 ){
       alert("Maxium Allowed 3 in Slider") ;
       $(":checkbox").prop("checked", false);
 return ;
    }
   }

        });
    });

мне нужно только 3 флажка проверки

  I have a bike: <input type="checkbox" name="vehicle" value="Bike"><br>
  I have a car: <input type="checkbox" name="vehicle" value="Car"><br>

   I have a bus: <input type="checkbox" name="vehicle" value="Car"><br>

     I have a mobile: <input type="checkbox" name="vehicle" value="Car"><br>
  I have an airplane: <input type="checkbox" name="vehicle" value="Airplane">

Answer 1

вы снимаете все флажки, если установлен четвертый флажок, $ (": checkbox"). Prop ("флажок", ложь);заменить на $ (this) .prop ("флажок", false);

$(document).ready(function(){
     $(":checkbox").change(function() {
     if(this.checked) {
    var numberOfChecked = $('input:checkbox:checked').length;
     if(numberOfChecked > 3 ){
       alert("Maxium Allowed 3 in Slider") ;
       $(this).prop('checked', false)
       return false;
    }
   }

        });
    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
I have a bike: <input type="checkbox" name="vehicle" value="Bike"><br>
  I have a car: <input type="checkbox" name="vehicle" value="Car"><br>

   I have a bus: <input type="checkbox" name="vehicle" value="Car"><br>

     I have a mobile: <input type="checkbox" name="vehicle" value="Car"><br>
  I have an airplane: <input type="checkbox" name="vehicle" value="Airplane">

Answer 2

Используйте ключевое слово this для захвата текущего установленного флажка.

Что вы сделали, сняли все флажки в соответствии с селектором $ (": checkbox")

$(document).ready(function(){
     $(":checkbox").change(function() {
     if (this.checked) {
        var numberOfChecked = $('input:checkbox:checked').length;
        if (numberOfChecked > 3 ) {
            alert("Maximum Allowed 3 in Slider") ;
            //COMMENT: below line fixes your problem
            $(this).prop("checked", false);
            return ;
        }
      }
   });
 });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
I have a bike: <input type="checkbox" name="vehicle" value="Bike"><br>
I have a car: <input type="checkbox" name="vehicle" value="Car"><br>
I have a bus: <input type="checkbox" name="vehicle" value="Car"><br>
I have a mobile: <input type="checkbox" name="vehicle" value="Car"><br>
I have an airplane: <input type="checkbox" name="vehicle" value="Airplane">