Ztree的权限控制详解

本是古典何须时尚 2022-02-28 11:58 218阅读 0赞

<table> 
 <tbody> 
  <tr> 
   <td> <h3 style="margin-left:0pt;">第一步(ztree文件引入)</h3> <pre><code>&lt;!-- 导入jquery核心类库 --&gt;
&lt;script type="text/javascript" src="./js/jquery-1.8.3.js"&gt;&lt;/script&gt;
 &lt;!-- 导入ztree类库 --&gt;
&lt;link rel="stylesheet" href="./js/ztree/zTreeStyle.css" type="text/css" /&gt;
&lt;script src="./js/ztree/jquery.ztree.all-3.5.js" type="text/javascript"&gt;&lt;/script&gt;</code></pre> <p>&nbsp;</p> </td> 
  </tr> 
  <tr> 
   <td> <h3 style="margin-left:0pt;">第二步(script代码)</h3> <pre><code>
&lt;script type="text/javascript"&gt;
	// 初始化ztree菜单
	$(function() {
		var setting = {
			data : {
				simpleData : { // 简单数据 
					enable : true
				}
			},
			callback : {
				onClick : onClick
			}
		};
		
		// 基本功能菜单加载
		$.ajax({
			url : '${pageContext.request.contextPath}/json/menu.json',
			type : 'POST',
			dataType : 'text',
			success : function(data) {
				var zNodes = eval("(" + data + ")");
				$.fn.zTree.init($("#treeMenu"), setting, zNodes);
			},
			error : function(msg) {
				alert('菜单加载异常!');
			}
		});

function onClick(event, treeId, treeNode, clickFlag) {
		// 判断树菜单节点是否含有 page属性
		if (treeNode.page!=undefined &amp;&amp; treeNode.page!= "") {
			var content = '&lt;div style="width:100%;height:100%;overflow:hidden;"&gt;'
					+ '&lt;iframe src="'
					+ treeNode.page
					+ '" scrolling="auto" style="width:100%;height:100%;border:0;" &gt;&lt;/iframe&gt;&lt;/div&gt;';
			if ($("#tabs").tabs('exists', treeNode.name)) {// 判断tab是否存在
				$('#tabs').tabs('select', treeNode.name); // 切换tab
				var tab = $('#tabs').tabs('getSelected'); 
				$('#tabs').tabs('update', {
				    tab: tab,
				    options: {
				        title: treeNode.name,
				        content: content
				    }
				});
			} else {
				// 开启一个新的tab页面
				$('#tabs').tabs('add', {
					title : treeNode.name,
					content : content,
					closable : true
				});
			}
		}
	  }
	});
	
&lt;/script&gt;</code></pre> <p>&nbsp;</p> </td> 
  </tr> 
  <tr> 
   <td> <h3 style="margin-left:0pt;">第三步(body使用)</h3> <pre><code>&lt;body&gt;
          	&lt;div class="left-bottom"&gt;
&lt;!-- 				************ztree***************** --&gt;
						&lt;ul id="treeMenu" class="ztree"&gt;&lt;/ul&gt;
				&lt;/div&gt;
&lt;/body&gt;</code></pre> <p>&nbsp;</p> </td> 
  </tr> 
  <tr> 
   <td> <h3 style="margin-left:0pt;">第四步、数据初始化文件</h3> <h3 style="margin-left:0pt;">Menu.json &nbsp;编码为utf-8否则会乱码</h3> <pre><code>[
		{ "id":"11", "pId":"0", "name":"基础数据"},
		{ "id":"112", "pId":"11", "name":"取派员设置",  "page":"page_base_staff.action"},
		{ "id":"113", "pId":"11", "name":"区域设置","page":"page_base_region.action"},
		{ "id":"114", "pId":"11", "name":"管理分区", "page":"page_base_subarea.action"},
		{ "id":"115", "pId":"11", "name":"管理定区/调度排班","page":"page_base_decidedzone.action"},
		{ "id":"12", "pId":"0", "name":"受理"},
		{ "id":"121", "pId":"12", "name":"业务受理" ,"page":"page_qupai_noticebill_add.action"},
		{ "id":"122", "pId":"12", "name":"工作单快速录入" ,"page":"page_qupai_quickworkorder.action"},
		{ "id":"124", "pId":"12", "name":"工作单导入" ,"page":"page_qupai_workorderimport.action"},
		{ "id":"13", "pId":"0", "name":"调度"},
		{ "id":"131", "pId":"13", "name":"查台转单","page":""},
		{ "id":"132", "pId":"13", "name":"人工调度","page":"page_qupai_diaodu.action"}
]</code></pre> <p><img alt="" height="219" src="https://img-blog.csdnimg.cn/20190325183036101.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTEyODU5ODk=,size_16,color_FFFFFF,t_70" width="554"><img alt="" height="398" src="https://img-blog.csdnimg.cn/20190325183057382.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTEyODU5ODk=,size_16,color_FFFFFF,t_70" width="728"></p> </td> 
  </tr> 
 </tbody> 
</table>

发表评论取消回复

表情：

评论列表（有 0 条评论，218人围观）

还没有评论，来说两句吧...

相关阅读

相关 Shiro权限控制(六):Shiro按钮权限控制

一、前言前段时间一直在研究如何通过标签方式控制控制的权限，我用HTML做页面的渲染，Shiro标签在HTML中不生效，但还是想用Shiro标签方式控制页面的按钮，有权限则

曾经终败给现在/ 2023年06月04日 09:54/ 0 赞/ 215 阅读

相关 php单独页面权限控制,PHP的privata权限控制

这篇文章介绍的内容是关于PHP的privata权限控制，有着一定的参考价值，现在分享给大家，有需要的朋友可以参考一下 // private权限控制 // ===代码部分1

桃扇骨/ 2022年11月17日 14:42/ 0 赞/ 178 阅读

相关 ZooKeeper节点权限控制详解

目录目标 ACL机制常用的权限命令实战演示world机制演示auth机制演示digest机制产生密文演示ip机制 -------------

布满荆棘的人生/ 2022年11月11日 14:50/ 0 赞/ 282 阅读

相关 Pureftpd的权限控制

摘要：Unix系统下pureftpd使用详解。特别是解决了很多人匿名用户无法登录的问题。与数据库的结合使得管理成千上万的用户很轻松。　　目录：　　一、Unix系统权限概

朱雀/ 2022年10月02日 02:00/ 0 赞/ 550 阅读

相关 Odoo 权限控制解析及 eval 详解

来自：http://www.oejia.net/blog/2016/02/21/odoo\_right\_ctrl.html 创建权限组示例

Bertha 。/ 2022年08月21日 12:55/ 0 赞/ 134 阅读

相关 springmvc ztree 实现权限菜单的展示

推荐最新技术springboot版权限管理（[java后台通用权限管理系统(springboot)][java_springboot]），采用最新技术架构，功能强大！注：由

深藏阁楼爱情的钟/ 2022年08月07日 05:53/ 0 赞/ 130 阅读

相关权限控制

原文：[http://baike.baidu.com/view/2108713.htm?fr=aladdin][http_baike.baidu.com_view_210871

╰半夏微凉°/ 2022年04月12日 02:44/ 0 赞/ 368 阅读

相关 MySQL权限控制

概述身份认证模块，即MySQL客户端通过指定用户名，密码，主机名来连接MySQL服务器，主要是认证给定的用户是否有权限连接MySQL服务器，而权限控制模块主要用于

女爷i/ 2022年03月10日 03:52/ 0 赞/ 338 阅读

相关 Ztree的权限控制详解

<table> <tbody> <tr> <td> <h3 style="margin-left:0pt;">第一步(ztree文件引入)</h3> <pre

本是古典何须时尚/ 2022年02月28日 11:58/ 0 赞/ 219 阅读

相关权限统一控制

权限统一控制 > 在很多场景下我们需要做权限控制，通常我们的做法是在场景请求数据时，在每个函数里面去判断是否有权限。但场景如果很多，更改权限控制逻辑时，每个场景的权限控制

逃离我推掉我的手/ 2021年10月23日 23:07/ 0 赞/ 411 阅读