1. 在当前HTML文档checked监听函数中增加以下代码
//联动
table.on('checkbox(quan_list)', function(obj){
//console.log(obj);
//当前id
var id = obj.data.id;
var status = obj.checked;
//所有子类选中
children_check(id,status);
//所有父类选中
parent_check(id,status);
});
2. 当前HTML文档增加两个自定义函数（名字可以随便起）
/**
* 递归
* 当前权限下所有的子权限
* @param id 当前权限id
* @param status checked 状态
*/
function children_check(id,status){
//所有子类
var children_list = $('.layui-table').find('span[lay-tpid='+id+']');
for (var i=0;i<children_list.length;i++){
var this_id = $(children_list[i]).attr('lay-tid');
if($('.layui-table').find('span[lay-tpid='+this_id+']').length > 0){
children_check(this_id,status);
}
}
children_list.parents('td').prev().find('input').next().toggleClass("layui-form-checked");;
children_list.parents('td').prev().find('input').prop('checked', status);
}
/**
* 递归
* 当前权限下所有的父元素
* @param id 当前权限id
* @param status checked 状态
*/
function parent_check(id,status){
// 父级
var pid = $('.layui-table').find('span[lay-tid='+id+']').attr('lay-tpid');
//最高层停止
if(pid == 0){
return false;
}
//查看同级元素是否还有选中的
var x_list = $('.layui-table').find('span[lay-tpid='+pid+']');
var check_num = 0
for (var i=0;i < x_list.length;i++){
if($(x_list[i]).parents('td').prev().find('input').prop('checked')){
check_num ++;
}
}
//修改父级状态
var parent_list = $('.layui-table').find('span[lay-tid='+pid+']');
if(status){
//选中样式
if(check_num == 1){
parent_list.parents('td').prev().find('input').next().addClass("layui-form-checked");
parent_list.parents('td').prev().find('input').prop('checked', true);
//查看父级是否还有父级
parent_check(pid,status);
}
}else{
if(check_num == 0) {
parent_list.parents('td').prev().find('input').next().removeClass("layui-form-checked");
parent_list.parents('td').prev().find('input').prop('checked', false);
//查看父级是否还有父级
parent_check(pid,status);
}
}
}
最终效果：
本站部分内容来源互联网,如果有图片或者内容侵犯了您的权益，请联系我们，我们会在确认后第一时间进行删除！