本示例只做到指定id用户的拥有的权限回显，并能动态获得ztree中重新选择的权限id。（至于权限的更新，就是后台人员对象和权限对象建立关系的过程，不做展示）
第一步：拼写jsp页面（下载ztree包，把css,js库导入webroot下。并在jsp页面上引用，将demo中ztree的显示代码贴上）如下
1 <html> 2 <head> 3 4 <link rel="stylesheet" href="<%=request.getContextPath() %>/css/zTreeStyle/zTreeStyle.css" type="text/css"> 5 <script type="text/javascript" src="<%=request.getContextPath() %>/js/jquery-1.4.4.min.js"></script> 6 <script type="text/javascript" src="<%=request.getContextPath() %>/js/jquery.ztree.core-3.5.js"></script> 7 <script type="text/javascript" src="<%=request.getContextPath() %>/js/jquery.ztree.excheck-3.5.js"></script> 8 <script type="text/javascript"> 9 //ztree的Demo代码 10 var setting = { 11 check: { 12 enable: true 13 }, 14 data: { 15 simpleData: { 16 enable: true 17 } 18 } 19 }; 20 //ztree的Demo代码 21 var zNodes; 22 23 24 //当页面加载完毕，向后台发送ajax请求，获取用户id为1的用户所拥有的权限（这里要显示所有权限，该id用户的权限回显时，被自动选中） 25 function loadPower(){ 26 $.ajax({ 27 type:"post", 28 url:"<%=request.getContextPath() %>/PowerAction!query", 29 data:{"uid":1}, 30 async:false, 31 dataType:"json", 32 success:function(msg){ 33 zNodes=msg["tree"]; 34 } 35 36 }) 37 38 } 39 40 //用户重新选择权限时，获取选择权限的id，此处可以拼接权限id的字符串，到后台切割成数组。String.split(",") 41 function test(){ 42 //获取被选中的节点集合 43 var treeObj = $.fn.zTree.getZTreeObj("treeDemo"); 44 var nodes = treeObj.getCheckedNodes(true); 45 //如果nodes的长度大于0说明ztree中有被选中的节点 46 if(nodes.length>0){ 47 for(var i=0;i<nodes.length;i++){ 48 var id=nodes[i]["id"];//获取选中节点的id 49 var name=nodes[i]["name"];//获取选中节点的名字 50 alert(id); 51 alert(name); 52 } 53 }else{ 54 alert("没有选中节点"); 55 } 56 57 } 58 59 //页面加载完毕时加载此方法 60 $(document).ready(function(){ 61 loadPower(); 62 $.fn.zTree.init($("#treeDemo"), setting, zNodes); 63 }); 64 </script> 65 </head> 66 67 <body> 68 <div class="zTreeDemoBackground left"> 69 <ul ></ul> 70 </div> 71 <input type="hidden" name="uid" value="${uid }"> 72 <input type="button" value="测试被选中的节点的id" onclick="test();" /> 73 </body> 74 </html>