jquery 实现复选框的全选操作实例代码

jquery 实现复选框的全选操作实例代码

最近做了个需求，需要实现列表复选框的全选/取消全选操作，由于之前对这块不是很了解，所以从网上查了一些资料，虽然有各种实现方法，但没找到直接可以套用的。自己琢磨了下，把功能实现，整理如下。

实现细节如有可改进的地方，不吝赐教。

首先是html部分的代码，这里有一个表格，表格里面有一些选项：

rush:xhtml;">

Box" name="group" value="1"/>Box" name="group" value="2"/>Box" name="group" value="3"/> 全选Box" id="all"/>

接下来是jquery：

rush:js;">

当全选框被点击时，判断选中状态，如果是选中，则为所有选项的复选框设置选中属性；如果是取消选中，则为所有选项的复选框取消选中属性。

同时，为每个选项复选框添加判断，当所有的选项复选框都选中时，全选框自动选中；否则，全选框取消选中。这里通过计数来比较（选项的数量和选中的选项数量），通过each方法来进行遍历。

最后，在显示时执行一次，这是确保如果初始状态就是所有选项都选中的状态，要保证全选框也是选中的状态。

参考：Box使用方法简单实例演示

原文地址：https://www.jb51.cc/jquery/42134.html

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [e-mail] 举报，一经查实，本站将立刻删除。

• 上一篇：Jquery树插件zTree实现菜单树下一篇：jquery实现拖动效果代码分享