checkbox 全选/反选功能的 jquery插件,支持多
简介
1. 如果点了【全部选择】了,则每一页都默认选择了
2. 如果点了【全部选择】了,又取消勾选了部分选项,则当前的状态还是全选状态,只是会保留此时未选择的项
3. 如果没有点【全部选择】,则每次已选项的值都会存入已选项中
Demo
XCheck为checkbox 全选/反选功能的 jquery插件,支持多页情况下保存已选项的情况。
如何使用 引用jquery.js 引用XCheck.js 属性及方法属性:
属性名 | 类型 | 默认值 | 说明 |
isKeep | boolean | false | 是否为【保持选择】的场景(比如ajax翻页多选) |
groupClass | string | ".xcheckgroup" | 【组】的class |
checkItemClass | string | ".checkItem" | 【要选择的每一项】的class |
checkAllClass | string | ".checkAll" | 【全选所有】的class |
checkAllCurrentClass | string | ".checkAllCurrent" | 【全选当页】的class |
clearCheckClass | string | ".clearCheck" | 【清空所有选择】的class |
clearCheckCurrentClass | string | ".clearCheckCurrent" | 【清空当页选择】的class |
reverseCheckCurrentClass | string | ".reverseCheckCurrent" | 【反选当页】的class |
valueClass | string | ".xcheckValue" | 【存放已选值】的class |
valueAttr | string | "value" | 【存放已选值】的属性 |
事件:
beforeCheckAll | function | function () { } | 【全选所有】前回调函数,如果返回false,则不执行默认的【全选所有】的事件 |
afterCheckAll | function | function () { } | 【全选所有】后的回调函数 |
beforeCheckAllCurrent | function | function () { } | 【全选当页】前的回调函数,如果返回false,则不执行默认的【全选当页】事件 |
afterCheckAllCurrent | function | function () { } | 【全选当页】后的回调函数 |
beforeCheckItem | function | function () { } | 【选择具体项】前回调函数,如果返回false,则不执行默认的【选择具体项】的事件 |
afterCheckItem | function | function () { } | 【选择具体项】后回调函数 |
beforeClearCheck | function | function () { } | 【清空选择所有】之前的回调函数,如果返回false,则不执行默认的【清空选择所有】的事件 |
afterClearCheck | function | function () { } | 【清空选择所有】之后的回调函数 |
beforeClearCheckCurrent | function | function () { } | 【清空选择当前页】之前的回调函数,如果返回false,则不执行默认的【清空选择当前页】的事件 |
afterClearCheckCurrent | function | function () { } | 【清空选择当前页】之后的回调函数 |
beforeReverseCheckCurrent | function | function () { } | 【反选当页】前的回调函数,如果返回false,则不执行默认的【反选当页】事件 |
afterReverseCheckCurrent | function | function () { } | 【反选当页】后的回调函数 |
公开方法
名称 | 说明 |
$.XCheck({...}).val(...) | 获取或设置结果值 |
$.XCheck({...}).initVal(...) | 根据指定的结果值,初始化插件状态 |
$.XCheck({...}).options | 获取当前的options |
isKeep==true时存放结果的SelectedBaseInfo对象:
属性名 | 类型 | 默认值 | 说明 |
isCheckAll | boolean | false | 是否全部保持已选状态 |
selectedValues | array | [] | 已选择项的值 |
unSelectedValues | array | [] | 未选择项的值 |
http://htmlpreview.github.io/?https://raw.githubusercontent.com/xucongli1989/XCheck/master/XCheck/demo.html
注:在线预览可能会不准确,请参考源码XCheck/demo.html
预览图版权声明:
1、该文章(资料)来源于互联网公开信息,我方只是对该内容做点评,所分享的下载地址为原作者公开地址。2、网站不提供资料下载,如需下载请到原作者页面进行下载。