EasyUi Tree树 节点选中和取消

最近出差,在客户方开发时用到了easyUI 等插件,他们自己提了个很有意思的bug,关于用户权限分配的tree树选中问题;

EasyUi Tree树 节点选中和取消_第1张图片

如上图当tree加载的时候就会调用oncheck事件,这个时候想要在oncheck事件中定义父节点选中则选中所有字节点时,加载tree时会出现   Uncaught RangeError: Maximum call stack size exceeded  -- 超过了最大调用堆栈大小 错误,简单点就是栈溢出了,因为加载递归调用 进入了死循环 导致,自己也试了很多,最后在网上找到了一种可行方案给大家分享一下

var check_switch=false;//定义 boolean 变量  作为初始化onCheck的开关
$("#roleModuleTree").tree({
parentField : 'pid',
lines : true,
rootProperty : 'modules',
checkbox:true,//是否带复选框
cascadeCheck:false,//定义是否层叠选中状态。
animate:true,//当节点展开或折叠是否显示动画效果。
checkcheck:true,//待查询是什么
url:'***********************',
onBeforeLoad : function(node, param) {
	check_switch=false;//初始化时  置为否  关闭onCheck事件开关
},
onLoadSuccess : function(node, data) {
	check_switch=true;//数据 加载成功 置为 true 打开onCheck事件开关
},
onCheck: function(node, checked){
	if(check_switch){// 数据加载成功  且是用户点击方才触发事件
	check_switch = false;//为了防止递归调用死循环 造成栈溢出 先关闭

	//当选中节点的时候,把对应的父节点选中
		if(checked){
			var parent = $("#roleModuleTree").tree('getParent', node.target);
			//var children = $("#roleModuleTree").tree('getChildren');
			if(parent){
				//alert(1);
				$('#roleModuleTree').tree('check', parent.target);
			}
		check_switch = true;//打开  父节点选中后

		//节点选中,则check所有子节点
		var children = $("#roleModuleTree").tree('getChildren', node.target);
		if(children){
			for(var i=0; i

你可能感兴趣的:(EasyUi)