metalCheckAll是一个轻量级且简单的jQuery CheckAll插件，允许用户只需单击一次即可选择和取消选择一组复选框。

非常适合选择/取消选择列表或数据表中的所有项目以进行批量操作，或通过使用户能够快速选择或清除多个选项来简化表单提交。

如何使用它:

1.下载并在页面上包含metalCheckAll-jQuery插件。

<script src="/path/to/cdn/jquery.slim.min.js"></script>
<script src="/path/to/jquery.metalCheckAll.js"></script>

2.将插件应用于主复选框，然后主复选框将控制所有相关复选框的选择和取消选择。

<!-- Master Checkbox -->
<input type="checkbox" id="example"> Select All

<!-- Checkbox Groups -->
<div class="group-1">
  <input type="checkbox" name="a">
  <input type="checkbox" name="a">
  <input type="checkbox" name="a">
</div>
<div class="group-2">
  <input type="checkbox" class="b">
  <input type="checkbox" class="b">
  <input type="checkbox" class="b">
</div>
<div class="group-3">
  <input type="checkbox" id="c">
  <input type="checkbox" id="c">
  <input type="checkbox" id="c">
</div>
<div class="group-4">
  <input type="checkbox" data-type="d">
  <input type="checkbox" data-type="d">
  <input type="checkbox" data-type="d">
</div>

$('#example3').metalCheckAll({
  target : ['input[name=a]', '.b', '#c', 'input[data-type="d"]'],
});

3.您还可以将“全选”功能应用于HTML按钮，如下所示：

<!-- Check All Button -->
<button id="example2"></button>

<!-- Checkboxes -->
<input type="checkbox" class="example2">
<input type="checkbox" class="example2">
<input type="checkbox" class="example2">

$('#example2').metalCheckAll({
  target : ['.example2'],
  btnValueChecked : 'Click ME',
  btnValueUnChecked : 'UnCheck Me'
});

预览截图

一键式复选框选择和取消选择 jQuery metalCheckAll