zTree簡單配置做一記錄，方便查閱：
1.根節點只有新增功能；
2.除根節點外的其他父節點有新增和編輯功能；
3.level>2時的葉子節點不再有新增功能（防止層級太多）；
4.level<=2的葉子節點具有增刪改功能；
5.不允許拖動爲子節點。
<link rel="stylesheet" href="/springmvc-mybatis/js/zTree/css/zTreeStyle/zTreeStyle.css" type="text/css">
<script type="text/javascript" src="/springmvc-mybatis/js/zTree/js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="/springmvc-mybatis/js/zTree/js/jquery.ztree.core.js"></script>
<script type="text/javascript" src="/springmvc-mybatis/js/zTree/js/jquery.ztree.excheck.js"></script>
<script type="text/javascript" src="/springmvc-mybatis/js/zTree/js/jquery.ztree.exedit.js"></script>
<script type="text/javascript">
var setting = {
view: {
//新增按鈕
addHoverDom: addHoverDom,
//鼠標離開隱藏按鈕
removeHoverDom: removeHoverDom,
//不允許多選節點
selectedMulti: false
},
data: {
simpleData: {
enable: true
}
},
edit: {
enable: true,
showRemoveBtn: function(treeId, treeNode) {
//葉子節點才顯示刪除按鈕
return treeNode.isParent ? false : true;
},
showRenameBtn: function(treeId, treeNode) {
//除根節點外的其他節點有編輯按鈕
return treeNode.level > 0 ? true : false;
},
drag: {
//不允許拖動成爲子節點
inner: false
}
}
};
var zNodes =[
{ id:0, pId:0, name:"父節點", open:true},
{ id:1, pId:0, name:"父節點1", open:true},
{ id:11, pId:1, name:"父節點11"},
{ id:111, pId:11, name:"葉子節點111"},
{ id:12, pId:1, name:"父節點12"},
{ id:121, pId:12, name:"葉子節點121"},
{ id:13, pId:1, name:"父節點13", isParent:true},
{ id:2, pId:0, name:"父節點2"},
{ id:21, pId:2, name:"父節點21", open:true},
{ id:211, pId:21, name:"葉子節點211"},
{ id:22, pId:2, name:"父節點22"},
{ id:221, pId:22, name:"葉子節點221"},
{ id:23, pId:2, name:"父節點23"},
{ id:231, pId:23, name:"葉子節點231"},
{ id:3, pId:0, name:"父節點3", isParent:true}
];
$(document).ready(function(){
$.fn.zTree.init($("#treeDemo"), setting, zNodes);
});
var newCount = 1;
function addHoverDom(treeId, treeNode) {
//level>2時不再具有新增子節點的功能。
if(treeNode.level > 2) return;
var sObj = $("#" + treeNode.tId + "_span");
if (treeNode.editNameFlag || $("#addBtn_"+treeNode.tId).length>0) return;
var addStr = "<span class='button add' id='addBtn_" + treeNode.tId
+ "' title='add node' οnfοcus='this.blur();'></span>";
sObj.after(addStr);
var btn = $("#addBtn_"+treeNode.tId);
if (btn) btn.bind("click", function(){
var zTree = $.fn.zTree.getZTreeObj("treeDemo");
zTree.addNodes(treeNode, {id:(100 + newCount), pId:treeNode.id, name:"new node" + (newCount++)});
return false;
});
};
function removeHoverDom(treeId, treeNode) {
$("#addBtn_"+treeNode.tId).unbind().remove();
};
</script>
</head>
<body>
<div class="content_wrap">
<div class="zTreeDemoBackground left">
<ul id="treeDemo" class="ztree"></ul>
</div>
</div>
</body>
