节点1,节点2,节点3
有以下四种方法
//展开树
function open(objNode){
//...your code 展开树
addClose(objNode)
}
//关闭树
function close(objNode){
//...your code 关闭树
addClose(objNode)
}
//添加展开事件
function addOpen(objNode){
//objNode节点对象
objNode.detachEvent.attachEvent("onclick",close)
objNode.attachEvent("onclick",open)
}
//添加关闭事件
function addClose(objNode){
//objNode节点对象
objNode.detachEvent.attachEvent("onclick",open)
objNode.attachEvent("onclick",close)
}
那么在生成树的时候给所有节点绑定方法open(objNode)就可以了。
上面的代码是用原生的JS写的。JQuery的。。你可以在网上找找如何绑定与删除事件。
用z-tree插件①带有父子关系的标准
zTreeNodes
举例:
Js代码
1.var zTreeNodes = [
2.{"id":1, "name":"test1", "nodes":[
3.{"id":11, "name":"test11", "nodes":[
4.{"id":111, "name":"test111"}
5."id":12, "name":"test12"}
②带有父子关系的简单
Array
格式
(isSimpleData)的zTreeNodes
举例:
Js代码
1.var treeNodes = [
2. {"id":1, "pId":0, "name":"test1"},
3.{"id":11, "pId":1, "name":"test11"},
4. {"id":12, "pId":1, "name":"test12"},
5. {"id":111, "pId":11, "name":"test111"},
例子:
(Java代码)
①在页面引用
zTree的js和css:
Html代码
1.
<!-- ZTree树形插件 -->
2.<link
rel="stylesheet"
href="<%=root%>/Web/common/css/zTreeStyle/zTreeStyle.css"type
="text/css">
3.<!-- <link rel="stylesheet" href="<%=root%>/Web/common/css/zTreeStyle/zTreeIcons.css" type="text/css"> -->
4.<script ype="text/javascript"src="<%=root%>/Web/common/js/jquery-ztree-2.5.min.js"
></script>