Z-tree插件(插件压缩包需要自己下载)
百度 ztree 下载插件
实例:
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Insert title here</title> <link rel="stylesheet" href="resources/css/demo.css" type="text/css"> <link rel="stylesheet" href="resources/css/zTreeStyle/zTreeStyle.css" type="text/css"> <script type="text/javascript" src="resources/js/jquery-1.4.4.min.js"></script> <script type="text/javascript" src="resources/js/jquery.ztree.core-3.5.js"></script> </head> <body> <div class="zTreeDemoBackground left"> <ul id="treeDemo" class="ztree"></ul> </div> <SCRIPT type="text/javascript"> var setting = { data: { simpleData: { enable: true } } , async: { enable: true, url:"/TestZTree/test", autoParam:["id", "name", "level"], otherParam:{"otherParam":"zTreeAsyncTest"}, dataFilter: filter } }; function filter(treeId, parentNode, childNodes) { if (!childNodes) return null; for (var i=0, l=childNodes.length; i<l; i++) { childNodes[i].name = childNodes[i].name.replace(/\.n/g, '.'); } return childNodes; } var zNodes =[ { id:1, pId:0, name:"parentNode 1", open:true}, { id:11, pId:1, name:"parentNode 11",isParent:true}, { id:111, pId:11, name:"leafNode 111"}, { id:112, pId:11, name:"leafNode 112"}, { id:12, pId:1, name:"parentNode 12",isParent:true}, { id:121, pId:12, name:"leafNode 121"}, { id:13, pId:1, name:"parentNode 13", isParent:true}, { id:2, pId:0, name:"parentNode 2", isParent:true} ]; $(document).ready(function(){ $.fn.zTree.init($("#treeDemo"), setting, zNodes); }); </SCRIPT> </body> </html>
点击获取所有的子节点
var setting = { data: { simpleData: { enable: true } }, callback: { onClick: treenodeClick } }; function treenodeClick(event, treeId, treeNode, clickFlag) { //此处treeNode 为当前节点 var str ='' ; str = getAllChildrenNodes(treeNode,str); alert(str); //所有叶子节点ID } function getAllChildrenNodes(treeNode,result){ if (treeNode.isParent) { var childrenNodes = treeNode.children; if (childrenNodes) { for (var i = 0; i < childrenNodes.length; i++) { result += ',' + childrenNodes[i].id; result = getChildNodes(childrenNodes[i], result); } } } return result; }