javascript - 使用 jquery 选中和取消选中所有复选框

Question

我正在使用这个脚本来选中和取消选中所有复选框:

$('#checkall').click(function () {
    var checked = $(this).data('checked');
    $('.chkall').find(':checkbox').attr('checked', !checked);
    $(this).data('checked', !checked);
});

效果很好，但是一旦我在“全部选中”后取消选中几个选中的复选框，然后再次点击“取消选中所有”和“全部选中”，那些以前未选中的复选框就不会再次选中。帮助会很棒!非常感谢!

Answer 1

这可能是正确的方法..

使用 prop 而不是 attr 并将复选框列表分组在一个 div 中，仅用于组织目的。也照原样使用checked，不要否定它。

$(document).ready(function() {
  $('#checkall').click(function() {
    var checked = $(this).prop('checked');
    $('#checkboxes').find('input:checkbox').prop('checked', checked);
  });
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" id="checkall" />
<label for="checkall">check / uncheck all</label>
<br/>
<br/>
<div id="checkboxes">
  <input type="checkbox" />
  <input type="checkbox" />
  <input type="checkbox" />
  <input type="checkbox" />
  <input type="checkbox" />
  <input type="checkbox" />
  <input type="checkbox" />

</div>