最小全选复选框插件 jquery.Checkbox.js

  • 源码大小:5.43KB
  • 所需积分:1积分
  • 源码编号:19JP-3131
  • 浏览次数:626次
  • 最后更新:2023年05月09日
  • 所属栏目:表单
本站默认解压密码:19jp.com 或 19jp_com

简介

一个轻量级快速的jQueryCheckAll插件,可以轻松管理多个复选框。

此插件允许PARENT复选框通过单击选中和取消选中其子项。还附带了一个回调函数,每当其中一个复选框更改状态时,该函数可用于触发自定义函数。

参见:

  • 选中所有复选框的10个最佳JavaScript插件

如何使用它:

1.下载jquery.checkbox.js脚本,并将其放在最新的jquery库之后(建议使用瘦版本)。

  1. <script src="/path/to/cdn/jquery.slim.min.js"></script>
  2. <script src="/path/to/jquery.checkbox.js"></script>

2.在页面上创建一个PARENT复选框输入,并在数据子项属性如下:

  1. <input id="checkbox" type="checkbox" data-children=".children">
  2. <div>
  3. <input type="checkbox" class="children" value="1" checked>
  4. <input type="checkbox" class="children" value="2">
  5. <input type="checkbox" class="children" value="3">
  6. <input type="checkbox" class="children" value="4">
  7. <input type="checkbox" class="children" value="5">
  8. <input type="checkbox" class="children" value="6">
  9. </div>

3.初始化插件:

  1. $(function(){
  2. var checkbox = $("#checkbox").checkbox();
  3. });

4.获取所选复选框的值。

  1. var checkbox = $("#checkbox").checkbox(function(values) {
  2. $("#output").html(values.join(','));
  3. });

预览截图