使用 jquery 和 Bootstrap 选中/取消选中所有复选框的问题

Question

I have a problem with checking all my checkboxes with Jquery.

With this code, I can check or uncheck all my boxes.
But if I check one bow manually that box leaves the group and don't follow the "checkAll" box anymore. Why is that?

First try the first checkbox.. then check another box and then try the first again.

 $('#checkAll').on('change', function(){ if($('#checkAll').is(":checked")){ //CHECK ALL BOXES $('.checkbox').attr('checked', true); } else{ //UNCHECK ALL BOXES $('.checkbox').attr('checked', false); } });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <input class="" type="checkbox" id="checkAll"> <input class="checkbox" type="checkbox"> <input class="checkbox" type="checkbox"> <input class="checkbox" type="checkbox"> <input class="checkbox" type="checkbox"> <input class="checkbox" type="checkbox">

Answer 1

please use this code:

$('#checkAll').on('change', function(){

   if($('#checkAll').is(":checked")){
       //CHECK ALL BOXES
       $('.checkbox').prop('checked', true);
   }
   else{
       //UNCHECK ALL BOXES
       $('.checkbox').prop('checked', false);
   }
});

enjoy!