|
先贴个demo - <div class="layui-input-block" id="lm-st1">
- <input type="checkbox" id="lm-st1All" name="lm-st1All" lay-filter="lm-st1All" title="全选">
- <input type="checkbox" lay-filter="lmSt1Fi" name="lmSt1[2]" title="完全相同">
- <input type="checkbox" lay-filter="lmSt1Fi" name="lmSt1[3]" title="部分相同">
- <input type="checkbox" lay-filter="lmSt1Fi" name="lmSt1[4]" title="任意位置加汉字">
- <input type="checkbox" lay-filter="lmSt1Fi" name="lmSt1[5]" title="变汉字">
- <input type="checkbox" lay-filter="lmSt1Fi" name="lmSt1[6]" title="减汉字">
- <input type="checkbox" lay-filter="lmSt1Fi" name="lmSt1[7]" title="含在其他商标中">
- <input type="checkbox" lay-filter="lmSt1Fi" name="lmSt1[8]" title="内含其他商标">
- <input type="checkbox" lay-filter="lmSt1Fi" name="lmSt1[9]" title="换序">
- <input type="checkbox" lay-filter="lmSt1Fi" name="lmSt1[10]" title="逆序">
- <input type="checkbox" lay-filter="lmSt1Fi" name="lmSt1[11]" title="读音相同">
- </div>
复制代码 再贴个 依赖layui 本身模块 小封装的 全选函数- // 表单全选功能封装
- // 1.lmObj ----提取出 包含所有checkbox的父级 div 内含全选
- // 2.提取出 全选按钮 的 lay-filter的值lmAF ID值 lmAI name 值 lmAN
- // 3.提取出 提取出 全选按钮意外的 所有checkbox 的 lay-filter的值
- function lmCheck(lmObj,lmCF,lmAF,lmAI,lmAN){
- lmAI = lmAI || lmAF ; //如果 filter 和 ID 和 name 都一样
- lmAN = lmAN || lmAF ;
- // 监听复选 类别全选
- form.on('checkbox('+ lmAF +')', function(data){
- console.log(data.elem.checked); //是否被选中,true或者false
- if(data.elem.checked){
- // 全选
- var child = $('#'+ lmObj +'').find('input[type="checkbox"]:not([name="'+ lmAN +'"])');
- child.each(function (index, item) {
- item.checked = data.elem.checked;
- });
- form.render('checkbox');
- }else{
- // 全不选
- var child = $('#'+ lmObj +'').find('input[type="checkbox"]:not([name="'+ lmAN +'"])');
- child.each(function (index, item) {
- item.checked = false;
- });
- form.render('checkbox');
- }
- });
- //通过判断机构是否全部选中来确定全选按钮是否选中
- form.on('checkbox('+ lmCF +')', function (data) {
- var child = $('#'+ lmObj +'').find('input[type="checkbox"]:not([name="'+ lmAN +'"])');
- var childChecked = $('#'+ lmObj +'').find('input[type="checkbox"]:not([name="'+ lmAN +'"]):checked');
- if (childChecked.length == child.length) {
- $('#'+ lmAF +'').prop('checked', true);
- } else {
- $('#'+ lmAF +'').prop('checked', false);
- }
- form.render('checkbox');
- })
- }
- // 调用
- lmCheck('lm-st1','lmSt1Fi','lm-st1All');
复制代码
|
|