Question

$("#main").click(function(e) {

  $('.child').prop('checked', !$('.child').prop("checked"));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="main" type="checkbox">
<br>
<br>
<input class="child" type="checkbox">
<br>
<input class="child" type="checkbox">
<br>
<input class="child" type="checkbox">
<br>
<input class="child" type="checkbox">
<br>

我在检查所有功能时遇到问题。当我点击#main时，即使是切换工作，一切都很好。但是先尝试点击第一个孩子，然后点击#main，我会在那里遇到一个奇怪的行为。它不会发生在2,3或4子复选框中，为什么会这样？

Answer 1

使用$(this)的{{1}} instread。

或者使用@Balachandran建议的$('.child')： -

＆＃13;

$('.child').prop('checked', this.checked);

＆＃13;

$("#main").click(function(e){       
    $('.child').prop('checked',$(this).prop("checked"));
});

$(".child").change(function(e){     
   if($('.child:checked').length== $('.child').length){
        $('#main').prop('checked',true);
   } else{
     $('#main').prop('checked',false);
   }

//or more short you can use
 $('#main').prop('checked',$('.child:checked').length== $('.child').length);
   
});

＆＃13;

点击第一个孩子后检查所有复选框错误

1 个答案: