dtree做权限控制

最新推荐文章于 2022-02-22 18:06:28 发布
最新推荐文章于 2022-02-22 18:06:28 发布
阅读量4.2k 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Logic_YSY/article/details/81270505
版权

一个项目需要一个权限控制的模块，因为是重构的项目，用的是dtree，所有着手研究了一手dtree。

网上也有好的地案例，比如http://www.jq22.com/jquery-info5331这个网址的模式，挺好的，就是太贵了，再比如：http://www.16css.com/menu/1184.html这个网站，里面有代码，是免费的，但是就是感觉里面的方法不太全，所以自己动手写了一个，代码如下：

样式模板 点击查看

这个里面没有全选，不全选，反选的方法，所以自定义了如下：


<html>

<head>
<meta charset="utf-8">
	 <title>dtree权限控制复选框插件</title>
<meta name="keywords" content="树形导航,js导航,垂直导航"/>
<meta name="description" content="具体效果请看演示，一流资源网推荐下载。" />
	<link rel="StyleSheet" href="css/dtree.css" type="text/css" />
    //需要引入的jq
	<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript" src="js/dtree.js"></script>

</head>

<body style="min-height: 500px;">


<div class="dtree" id="bTest">

	<!--<p><a href="javascript:  d.closeAll();">open all</a> | <a href="javascript: d.openAll();">close all</a></p>-->

	<script type="text/javascript">
		<!--
		d = new dTree('d');

		d.add(0,-1,'权限管理');
		d.add(1,0,'authority','0001','日常工作');
		d.add(2,1,'authority','0002','新建工作');
		d.add(3,2,'authority','0003','人事 ');
		d.add(4,2,'authority','0004','财务');
		d.add(5,2,'authority','0005','客服');
        d.add(15,3,'authority','0006','请假申请');
		d.add(16,3,'authority','0007','出差申请');
		d.add(17,3,'authority','0008','招聘申请');
		
		// dTree实例属性以此为：  节点ID，父类ID，chechbox的名称，chechbox的值，chechbox的显示名称，chechbox是否被选中--默认是不选，chechbox是否可用：默认是可用，节点链接：默认是虚链接
		d.add(6,0,'authority','0012','一级菜单2 ',true,false);
		d.add(7,6,'authority','0013','二级菜单2 ',true,false);
		d.add(8,7,'authority','0014','用户管理 ',true,false);
		d.add(9,7,'authority','0015','用户组管理 ',true,false);
		
		
		d.add(11,0,'authority','0016','一级菜单3 ');
		d.add(12,11,'authority','0017','二级菜单3 ');
		d.add(13,12,'authority','0018','用户管理 ');
		d.add(14,12,'authority','0019','用户组管理 ');		

		//document.write(d);测个地方最好不要用这个方法，因为write的方法回吧所有的内容清空的。
		$("#bTest").html(d.toString());//这里用的是jq的方法需要引入jq
		d.openAll();
		//-->
	</script>

</div>
<div>
<input type='button' name='bTest' value='全选' onclick='checkedAll();'>  
<input type='button' name='bTest' value='不全选' onclick='uncheckedAll();'> 
<input type='button' name='bTest' value='反选' onclick='unchecked();'> 
<p><a href="javascript:  d.closeAll();">open all</a> | <a href="javascript: d.openAll();">close all</a></p>
</div>
</body>
</html>

js的代码如下dtree.js：

/*--------------------------------------------------|
| dTree 2.05 | www.destroydrop.com/javascript/tree/ |
|---------------------------------------------------|
| Copyright (c) 2009-2010 Geir Landr?               |
|                                                   |
| This script can be used freely as long as all     |
| copyright messages are intact.                    |
|                                                   |
| Updated: 20.07.2009                               |
|--------------------------------------------------*/


//==================================================
//luzhilin 
//
//==================================================
// Node object
function Node(id, pid, cname, cvalue, cshow, cchecked, cdisabled, url, title, target, icon, iconOpen, open) {
	this.id = id;
	this.pid = pid;
	//chechbox�����
	this.cname = cname;
	//chechbox��ֵ
	this.cvalue = cvalue;
	//chechbox����ʾ
	this.cshow = cshow;
	//chechbox�Ƿ�ѡ�У�Ĭ���Dz�ѡ
	this.cchecked = cchecked||false;
	//chechbox�Ƿ���ã�Ĭ���ǿ���
	this.cdisabled = cdisabled||false;
	//�ڵ����ӣ�Ĭ����������
	this.url = url||'#';
	this.title = title;
	this.target = target;
	this.icon = icon;
	this.iconOpen = iconOpen;
	this._io = open || false;
	this._is = false;
	this._ls = false;
	this._hc = false;
	this._ai = 0;
	this._p;
};

// Tree object
function dTree(objName) {
	this.config = {
		target					: null,
		folderLinks			: false,
		useSelection		: false,
		useCookies			: false,
		useLines				: true,
		useIcons				: false,
		useStatusText		: true,
		closeSameLevel	: false,
		inOrder					: false
	}
	this.icon = {
		root				: 'img/base.gif',
		folder			: 'img/folder.gif',
		folderOpen	: 'img/folderopen.gif',
		node				: 'img/page.gif',
		empty				: 'img/empty.gif',
		line				: 'img/line.gif',
		join				: 'img/join.gif',
		joinBottom	: 'img/joinbottom.gif',
		plus				: 'img/plus.gif',
		plusBottom	: 'img/plusbottom.gif',
		minus				: 'img/minus.gif',
		minusBottom	: 'img/minusbottom.gif',
		nlPlus			: 'img/nolines_plus.gif',
		nlMinus			: 'img/nolines_minus.gif'
	};
	this.obj = objName;
	this.aNodes = [];
	this.aIndent = [];
	this.root = new Node(-1);
	this.selectedNode = null;
	this.selectedFound = false;
	this.completed = false;
};

// Adds a new node to the node array
dTree.prototype.add = function(id, pid, cname, cvalue, cshow, cchecked, cdisabled, url, title, target, icon, iconOpen, open) {
	this.aNodes[this.aNodes.length] = new Node(id, pid, cname, cvalue, cshow, cchecked, cdisabled, url, title, target, icon, iconOpen, open);
};

// Open/close all nodes
dTree.prototype.openAll = function() {
	this.oAll(false);
};
dTree.prototype.closeAll = function() {
	this.oAll(true);
};

// Outputs the tree to the page
dTree.prototype.toString = function() {
	var str = '<div class="dtree">\n';
	if (document.getElementById) {
		if (this.config.useCookies) this.selectedNode = this.getSelected();
		str += this.addNode(this.root);
	} else str += 'Browser not supported.';
	str += '</div>';
	if (!this.selectedFound) this.selectedNode = null;
	this.completed = true;
	return str;
};

// Creates the tree structure
dTree.prototype.addNode = function(pNode) {
	var str = '';
	var n=0;
	if (this.config.inOrder) n = pNode._ai;
	for (n; n<this.aNodes.length; n++) {
		if (this.aNodes[n].pid == pNode.id) {
			var cn = this.aNodes[n];
			cn._p = pNode;
			cn._ai = n;
			this.setCS(cn);
			if (!cn.target && this.config.target) cn.target = this.config.target;
			if (cn._hc && !cn._io && this.config.useCookies) cn._io = this.isOpen(cn.id);
			if (!this.config.folderLinks && cn._hc) cn.url = null;
			if (this.config.useSelection && cn.id == this.selectedNode && !this.selectedFound) {
					cn._is = true;
					this.selectedNode = n;
					this.selectedFound = true;
			}
			str += this.node(cn, n);
			if (cn._ls) break;
		}
	}
	return str;
};

// Creates the node icon, url and text
dTree.prototype.node = function(node, nodeId) {
	var str = '<div class="dTreeNode">' + this.indent(node, nodeId);
	if (this.config.useIcons) {
		if (!node.icon) node.icon = (this.root.id == node.pid) ? this.icon.root : ((node._hc) ? this.icon.folder : this.icon.node);
		if (!node.iconOpen) node.iconOpen = (node._hc) ? this.icon.folderOpen : this.icon.node;
		if (this.root.id == node.pid) {
			node.icon = this.icon.root;
			node.iconOpen = this.icon.root;
		}
		str += '<img id="i' + this.obj + nodeId + '" src="' + ((node._io) ? node.iconOpen : node.icon) + '" alt="" />';
	}
	if (node.url) {
		str += '<a id="s' + this.obj + nodeId + '" class="' + ((this.config.useSelection) ? ((node._is ? 'nodeSel' : 'node')) : 'node') + '" href="' + node.url + '"';
		if (node.title) str += ' title="' + node.title + '"';
		if (node.target) str += ' target="' + node.target + '"';
		if (this.config.useStatusText) str += ' onmouseover="window.status=\'' + node.cname + '\';return true;" onmouseout="window.status=\'\';return true;" ';
		if (this.config.useSelection && ((node._hc && this.config.folderLinks) || !node._hc))
			str += ' onclick="javascript: ' + this.obj + '.s(' + nodeId + ');"';
		str += '>';
	}
	else if ((!this.config.folderLinks || !node.url) && node._hc && node.pid != this.root.id)
		str += '<a href="javascript: ' + this.obj + '.o(' + nodeId + ');" class="node">';
	//===============================================
	//2009-07-11 ��ԭ���ӵĽڵ��޸�Ϊ checkbox
	//===============================================
	//str += node.name;
	if(node.pid == this.root.id){
		str += node.cname;
	}else{
		/**��װcheckbox��ʼ*/
		checkboxSyntax = "<input type='checkbox' desc='" + node.cshow + "' name='" + node.cname + "' id='" + node.cname + "_" + node.id + "' value='" + node.cvalue + "' onClick='javascript: " + this.obj + ".checkNode(" + node.id+","+node.pid+","+node._hc + ",this.checked);' ";
		//�Ƿ�ѡ��
		if(node.cchecked)
			checkboxSyntax += " checked ";
		//�Ƿ����
		if(node.cdisabled)
			checkboxSyntax += " disabled ";			
		checkboxSyntax += ">" + node.cshow;
		/**��װcheckbox����*/
				
		str += checkboxSyntax;
	}
		
	if (node.url || ((!this.config.folderLinks || !node.url) && node._hc)) str += '</a>';
	str += '</div>';
	if (node._hc) {
		str += '<div id="d' + this.obj + nodeId + '" class="clip" style="display:' + ((this.root.id == node.pid || node._io) ? 'block' : 'none') + ';">';
		str += this.addNode(node);
		str += '</div>';
	}
	this.aIndent.pop();
	return str;
};

// Adds the empty and line icons
dTree.prototype.indent = function(node, nodeId) {
	var str = '';
	if (this.root.id != node.pid) {
		for (var n=0; n<this.aIndent.length; n++)
			str += '<img src="' + ( (this.aIndent[n] == 1 && this.config.useLines) ? this.icon.line : this.icon.empty ) + '" alt="" />';
		(node._ls) ? this.aIndent.push(0) : this.aIndent.push(1);
		if (node._hc) {
			str += '<a href="javascript: ' + this.obj + '.o(' + nodeId + ');"><img id="j' + this.obj + nodeId + '" src="';
			if (!this.config.useLines) str += (node._io) ? this.icon.nlMinus : this.icon.nlPlus;
			else str += ( (node._io) ? ((node._ls && this.config.useLines) ? this.icon.minusBottom : this.icon.minus) : ((node._ls && this.config.useLines) ? this.icon.plusBottom : this.icon.plus ) );
			str += '" alt="" /></a>';
		} else str += '<img src="' + ( (this.config.useLines) ? ((node._ls) ? this.icon.joinBottom : this.icon.join ) : this.icon.empty) + '" alt="" />';
	}
	return str;
};

// Checks if a node has any children and if it is the last sibling
dTree.prototype.setCS = function(node) {
	var lastId;
	for (var n=0; n<this.aNodes.length; n++) {
		if (this.aNodes[n].pid == node.id) node._hc = true;
		if (this.aNodes[n].pid == node.pid) lastId = this.aNodes[n].id;
	}
	if (lastId==node.id) node._ls = true;
};

// Returns the selected node
dTree.prototype.getSelected = function() {
	var sn = this.getCookie('cs' + this.obj);
	return (sn) ? sn : null;
};

//===============================
// luzhilin 2006-05-11
//
//���ã�ѡ�нڵ����
//����nobj node����
//      cobj checkbox����
//===============================
dTree.prototype.checkNode = function(id,pid,_hc,checked) {
	//1���ݹ�ѡ���ڵ����������Ҷ�ڵ㻹���м�ڵ㣩
	//�ж�ͬ�������ޱ�ѡ�еģ������ѡ�еľͲ����Է�ѡ
	if(!this.isHaveBNode(id,pid)){
		if(checked){
			this.checkPNodeRecursion(pid,checked);
		}else{
			this.checkPNode(pid,checked);
		}
	}	
	
	//2��������м��㣬���ж��ӣ��ݹ�ѡ�ӽڵ����		
	if(_hc)		
		this.checkSNodeRecursion(id,checked);
	
}

//===============================
// luzhilin 2006-05-11
//
//===============================
dTree.prototype.isHaveBNode = function(id,pid) {	
	var isChecked = false
	for (var n=0; n<this.aNodes.length; n++) {
		// ���ǽڵ���������ͬ���ڵ��ֵܽڵ�
		if (this.aNodes[n].pid!=-1&&this.aNodes[n].id!=id&&this.aNodes[n].pid == pid) {			
			if(eval("document.all."+ this.aNodes[n].cname + "_" + this.aNodes[n].id + ".checked"))
				isChecked = true;			
		}
	}
	
	return isChecked;
};

//===============================
// luzhilin 2006-05-11
//===============================
dTree.prototype.checkPNodeRecursion = function(pid,ischecked) {	
	for (var n=0; n<this.aNodes.length; n++) {
		if (this.aNodes[n].pid!=-1&&this.aNodes[n].id == pid) {			
			eval("document.all."+ this.aNodes[n].cname + "_" + this.aNodes[n].id + ".checked = " + ischecked);
			this.checkPNodeRecursion(this.aNodes[n].pid,ischecked);
			break;
		}
	}
};

//===============================
// luzhilin 2006-05-11
//
//���ã��ݹ�ѡ���ӽڵ����
//����id �ڵ�id
//      ischecked �Ƿ�ѡ��
//===============================
dTree.prototype.checkSNodeRecursion = function(id,ischecked) {	
	for (var n=0; n<this.aNodes.length; n++) {
		if (this.aNodes[n].pid!=-1&&this.aNodes[n].pid == id) {			
			eval("document.all."+ this.aNodes[n].cname + "_" + this.aNodes[n].id + ".checked = " + ischecked);
			this.checkSNodeRecursion(this.aNodes[n].id,ischecked);			
		}
	}
};

//===============================
// luzhilin 2006-05-11
//
//���ã���ѡ�и��ڵ����
//����pid �ڵ�ĸ��ڵ�id
//      ischecked �Ƿ�ѡ��
//===============================
dTree.prototype.checkPNode = function(pid,ischecked) {	
	for (var n=0; n<this.aNodes.length; n++) {
		if (this.aNodes[n].pid!=-1&&this.aNodes[n].id == pid) {			
			eval("document.all."+ this.aNodes[n].cname + "_" + this.aNodes[n].id + ".checked = " + ischecked);			
			break;
		}
	}
};

// Highlights the selected node
dTree.prototype.s = function(id) {
	if (!this.config.useSelection) return;
	var cn = this.aNodes[id];
	if (cn._hc && !this.config.folderLinks) return;
	if (this.selectedNode != id) {
		if (this.selectedNode || this.selectedNode==0) {
			eOld = document.getElementById("s" + this.obj + this.selectedNode);
			eOld.className = "node";
		}
		eNew = document.getElementById("s" + this.obj + id);
		eNew.className = "nodeSel";
		this.selectedNode = id;
		if (this.config.useCookies) this.setCookie('cs' + this.obj, cn.id);
	}
};

// Toggle Open or close
dTree.prototype.o = function(id) {
	var cn = this.aNodes[id];
	this.nodeStatus(!cn._io, id, cn._ls);
	cn._io = !cn._io;
	if (this.config.closeSameLevel) this.closeLevel(cn);
	if (this.config.useCookies) this.updateCookie();
};

// Open or close all nodes
dTree.prototype.oAll = function(status) {
	for (var n=0; n<this.aNodes.length; n++) {
		if (this.aNodes[n]._hc && this.aNodes[n].pid != this.root.id) {
			this.nodeStatus(status, n, this.aNodes[n]._ls)
			this.aNodes[n]._io = status;
		}
	}
	if (this.config.useCookies) this.updateCookie();
};

// Opens the tree to a specific node
dTree.prototype.openTo = function(nId, bSelect, bFirst) {
	if (!bFirst) {
		for (var n=0; n<this.aNodes.length; n++) {
			if (this.aNodes[n].id == nId) {
				nId=n;
				break;
			}
		}
	}
	var cn=this.aNodes[nId];
	if (cn.pid==this.root.id || !cn._p) return;
	cn._io = true;
	cn._is = bSelect;
	if (this.completed && cn._hc) this.nodeStatus(true, cn._ai, cn._ls);
	if (this.completed && bSelect) this.s(cn._ai);
	else if (bSelect) this._sn=cn._ai;
	this.openTo(cn._p._ai, false, true);
};

// Closes all nodes on the same level as certain node
dTree.prototype.closeLevel = function(node) {
	for (var n=0; n<this.aNodes.length; n++) {
		if (this.aNodes[n].pid == node.pid && this.aNodes[n].id != node.id && this.aNodes[n]._hc) {
			this.nodeStatus(false, n, this.aNodes[n]._ls);
			this.aNodes[n]._io = false;
			this.closeAllChildren(this.aNodes[n]);
		}
	}
}

// Closes all children of a node
dTree.prototype.closeAllChildren = function(node) {
	for (var n=0; n<this.aNodes.length; n++) {
		if (this.aNodes[n].pid == node.id && this.aNodes[n]._hc) {
			if (this.aNodes[n]._io) this.nodeStatus(false, n, this.aNodes[n]._ls);
			this.aNodes[n]._io = false;
			this.closeAllChildren(this.aNodes[n]);		
		}
	}
}

// Change the status of a node(open or closed)
dTree.prototype.nodeStatus = function(status, id, bottom) {
	eDiv	= document.getElementById('d' + this.obj + id);
	eJoin	= document.getElementById('j' + this.obj + id);
	if (this.config.useIcons) {
		eIcon	= document.getElementById('i' + this.obj + id);
		eIcon.src = (status) ? this.aNodes[id].iconOpen : this.aNodes[id].icon;
	}
	eJoin.src = (this.config.useLines)?
	((status)?((bottom)?this.icon.minusBottom:this.icon.minus):((bottom)?this.icon.plusBottom:this.icon.plus)):
	((status)?this.icon.nlMinus:this.icon.nlPlus);
	eDiv.style.display = (status) ? 'block': 'none';
};


// [Cookie] Clears a cookie
dTree.prototype.clearCookie = function() {
	var now = new Date();
	var yesterday = new Date(now.getTime() - 1000 * 60 * 60 * 24);
	this.setCookie('co'+this.obj, 'cookieValue', yesterday);
	this.setCookie('cs'+this.obj, 'cookieValue', yesterday);
};

// [Cookie] Sets value in a cookie
dTree.prototype.setCookie = function(cookieName, cookieValue, expires, path, domain, secure) {
	document.cookie =
		escape(cookieName) + '=' + escape(cookieValue)
		+ (expires ? '; expires=' + expires.toGMTString() : '')
		+ (path ? '; path=' + path : '')
		+ (domain ? '; domain=' + domain : '')
		+ (secure ? '; secure' : '');
};

// [Cookie] Gets a value from a cookie
dTree.prototype.getCookie = function(cookieName) {
	var cookieValue = '';
	var posName = document.cookie.indexOf(escape(cookieName) + '=');
	if (posName != -1) {
		var posValue = posName + (escape(cookieName) + '=').length;
		var endPos = document.cookie.indexOf(';', posValue);
		if (endPos != -1) cookieValue = unescape(document.cookie.substring(posValue, endPos));
		else cookieValue = unescape(document.cookie.substring(posValue));
	}
	return (cookieValue);
};

// [Cookie] Returns ids of open nodes as a string
dTree.prototype.updateCookie = function() {
	var str = '';
	for (var n=0; n<this.aNodes.length; n++) {
		if (this.aNodes[n]._io && this.aNodes[n].pid != this.root.id) {
			if (str) str += '.';
			str += this.aNodes[n].id;
		}
	}
	this.setCookie('co' + this.obj, str);
};

// [Cookie] Checks if a node id is in a cookie
dTree.prototype.isOpen = function(id) {
	var aOpen = this.getCookie('co' + this.obj).split('.');
	for (var n=0; n<aOpen.length; n++)
		if (aOpen[n] == id) return true;
	return false;
};

// If Push and pop is not implemented by the browser
if (!Array.prototype.push) {
	Array.prototype.push = function array_push() {
		for(var i=0;i<arguments.length;i++)
			this[this.length]=arguments[i];
		return this.length;
	}
};
if (!Array.prototype.pop) {
	Array.prototype.pop = function array_pop() {
		lastElement = this[this.length-1];
		this.length = Math.max(this.length-1,0);
		return lastElement;
	}
};
//全选的方法，logic 写在2018-7-29
function checkedAll(){
	var obj = document.all.authority;	
	for(i=0;i<obj.length;i++){
		obj[i].checked = true;
	}	
}
//全不选的方法，logic 写在2018-7-29
function uncheckedAll(){
	var obj = document.all.authority;	
	for(i=0;i<obj.length;i++){
		obj[i].checked = false;
	}	
}

//反选的方法，logic 写在2018-7-29
function unchecked(){
	var obj = document.all.authority;	
	for(i=0;i<obj.length;i++){
		if(obj[i].checked){	
			obj[i].checked = false;
		}else{
			obj[i].checked = true;
		}
	}	
}

欢迎各位大佬指正

Logic_YSY
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
SSM框架之酒店管理系统六（角色管理分配菜单）layui.dtree树形菜单插件使用
我要记录学习博客
05-17 858
SSM框架之酒店管理系统六（角色管理分配菜单） 1、树形菜单的使用 复制下载的layu树形图到webapp.statics文件夹下 官网下载地址：layui.dtree帮助手册 (wisdomelon.com) 根据官网的使用导入相关的css和js文件，到roleManager.jsp角色管理页面 <link rel="stylesheet" href="layui/css/layui.css"> <link rel="stylesheet" href="layui_ext/d
dtree 取消复选框的全选功能，并获取复选框选中的数据
qq_40113688的博客
01-03 1476
需求：每个节点下面都有自己对应的用户，复选框选中之后，当前节点下的人全部选中，取消选中之后，与当前节点下的人全部不选中，父级节点与子级节点之间选中状态互不影响。JS 实现 // 初始化树 var DemoTree = dtree.render({ elem: "#demoTree", url: url, dat...
dtree树形菜单带搜索复选框单选框插件
胡老汉的博客
04-30 1387
dtree树形菜单带搜索复选框单选框插件 用于选择部门或者选择部门下人员 效果如下图 dtree树形菜单带搜索不带单选框复选框 dtree选择部门或者选择部门下人员复选框单选框插件 带搜索 https://download.csdn.net/download/qq_27559331/9885259 ...
树形复选框（dtree）
09-20
树形复选框（dtree）树形复选框（dtree）树形复选框（dtree）
dtree新改版-添加checkbox复选框
09-16
dtree修改版-添加checkbox： 由于原版dtree作者没有加上复选框功能，我用来做用户模块权限功能的时候很不好用，网上也找到一些基于dtree添加了checkbox的修改版，但是用起来很不顺手，最后不得不根据自己的需要一再修改成了现在这个版本。大家看看是否能用到，如果觉得还要进行修改可以给我提出，在我力所能及范围内我会尽力去修改。
dtree权限控制复选框插件
02-19
【dtree权限控制复选框插件】是一种用于前端用户界面设计的工具，它结合了树形结构和权限管理的功能，使得用户可以根据自己的权限在界面上进行选择操作。这种插件通常被用在多级权限分配、角色管理或复杂业务流程...
树状权限控制
01-22
在实际应用中，"dtree"可能是一个JavaScript库或组件，用于在前端实现动态树形结构的展示和交互，它可能提供了节点的增删改查、展开收起、选中状态等功能，同时支持权限控制的接口，使得后端返回的权限数据能够映射...
dtree权限控制js+全选，不全选，反选
07-29
dtree权限控制js+全选，不全选，反选，可以自己自定义的去实现。如果没有C币的话可以在我的博客里面找，我已经贴出来了，也可以私聊我要，谢谢！
Dtree动态树菜单
11-26
在IT领域，动态树形菜单是一种常见的用户界面元素，它以树状结构展示数据，允许用户通过层级关系来浏览和操作信息。...通过对Dtree的理解和运用，开发者可以为用户提供直观且高效的导航体验，同时实现灵活的权限控制。
带有checkbox的权限树
01-23
带有checkbox的权限树，当选中父节点时，子节点全选中，子节点未全部选中是，父节点半选中，子节点全部选中是，父节点同时选中
dtree选择部门或者选择部门下人员复选框单选框插件带搜索
06-30
dtree选择部门或者选择部门下人员复选框单选框插件
权限复选框
04-27
多级权限复选框 ，复选框—上下级关系。可以多级连选
dtree改造-复选框(父菜单、子菜单全选)
08-14
dtree改造-复选框(父菜单、子菜单全选)
dtree树形菜单(有带checkbox实现)
01-24
本工程使用dTree组件实现树形菜单的展示 有静态树形菜单和动态(从数据库获取数据)树形菜单展示两种 数据库连接采用简单的类实现 数据位MySQL(5.0.21),数据库创建脚本为dtree.sql 菜单既有普通的树结构展示,也有方便做权限等功能的带选择框的展示(含带默认选中checkbox的处理)
jQuery插件之TreeMultiselect 多用于权限配置
东成熙就
02-22 3739
通过JS(jQuery)一个插件将select元素实现树状选择，并可以选择不同的项。可用于配置用户权限、菜单等。
zTree禁止点击部门
王晓安
11-15 6586
今天遇到一个问题，做报告需要选择一个团队负责人，用zTree做展示。但是只能选择员工，而不能选择部门，所以需要判断当前点击节点是否为员工节点，而非部门节点。此情况的特殊性在于：当部门员工为空时，部门节点不是父节点，但是不应该被选择。所以不应该用是否为父节点来判断，而是用level（根节点 level = 0，依次递增）来判断。
dtree.js树形控件详解(未完)
huangshengzhi的专栏
11-06 1280
/*--------------------------------------------------| | dTree 2.05 | www.destroydrop.com/javascript/tree/ | |---------------------------------------------------| | Copyright (c) 2002-2003 Geir Land
dtree.js详解
weixin_33841722的博客
08-15 532
最近在做网页的时候用到了这个组件，以下是网上找到的资料，备用参考：大概是最早的dtree连接，这里有他的示例和api文档.http://www.destroydrop.com/javascripts/tree/说dtree是使用最广泛的目录树javascript应该也不为过.这得意于他简单的使用方式和良好的结构.// Node objectfunction Node(id, ...
权限管理之复选框回显 （Layui框架）
yvonne__my的博客
03-09 1193
在修改权限的时候会碰到权限的回显，首先要将所有的权限取出进行展示，然后再根据角色已有的权限进行相应的回显。这里的回显用的是弹框，在弹框中利用table来展示数据。 第一步，在加载页面的同时将弹框写好，避免每点击一次编辑就请求一次接口。 效果图： 代码： layui.config({base: '/js/base/'}).use(['table', 'jquery', 'form'], funct...
django dtree
最新发布
04-28
此外，Django dtree还提供了自定义节点样式的选项，并且可以根据用户权限显示隐藏节点。该库采用jQuery和Django框架的集成方式，因此易于安装和使用。它的应用范围十分广泛，可以用于创建复杂的导航菜单、文件系统...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值