复选框已选中 false 仅选中复选框答案

【问题标题】：check box checked false only selected check box复选框已选中 false 仅选中复选框
【发布时间】：2019-10-15 15:00:37
【问题描述】：

我有一些动态复选框，我只检查了最多 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">

【问题讨论】：

$(this).prop("checked", false);

标签： jquery checkbox

【解决方案1】：

使用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">

【讨论】：