jQuery实现Checkbox全选、反选及获取选中值

该资源主要介绍如何在网页中使用Checkbox（复选框）进行全选、全不选操作，以及如何获取一组Checkbox的选择内容。它使用了jQuery库来实现这些功能。 在网页交互中，Checkbox通常用于让用户多选一项或多项选项。全选和全不选功能对于列表或表格中的多选项选择非常有用。这个教程讲解了通过jQuery来控制Checkbox的状态，并获取用户的选择结果。 1. 全选和全不选 - 使用jQuery的`attr()`方法可以改变Checkbox的`checked`属性。当`checked`属性值为`true`时，Checkbox被选中；为`false`时，Checkbox未被选中。 - `$("#all").click()`事件监听`#all` ID的元素（通常是全选按钮），点击时通过`this.checked`判断是否勾选，然后设置所有`#list`下级的Checkbox的`checked`属性。 2. 单独全选 - `$("#selectAll").click()`事件用于单独全选所有Checkbox，包括`#all`本身，这样在用户反选所有项后，全选按钮也会取消选中状态。 3. 单独全不选 - `$("#unSelect").click()`事件则用于取消所有Checkbox的选择状态，同样包括`#all`。 4. 反选 - `$("#reverse").click()`事件用于反转所有Checkbox的选中状态，通过循环遍历并改变每个Checkbox的`checked`属性实现。 5. 全选状态检查 - `allchk()`函数用于检查当前是否所有Checkbox都被选中。它计算选中项的数量`chknum`并与总数量进行比较，如果相等，则表示全选。 6. 获取选中项的值 - `$("#getValue").click()`事件触发时，会创建一个新的数组`valArr`，存储所有选中Checkbox的值。使用`join(',')`将数组元素转换为逗号分隔的字符串，便于展示或传递。 通过以上代码，你可以实现在一个列表中对Checkbox的全选、全不选、反选操作，并能方便地获取到用户选定的Checkbox的值。这在开发涉及多选功能的网页应用时非常实用。