DWZ整合zTree(实现版)
?
3. 整合步骤
3.1.CSS替换:
????? 找到DWZ中的core.css 文件,注释tree样式;将zTree中的样式文件css/zTreeStyle/zTreeStyle.css内容拷贝至core.css中,最好是文件追加;并将zTree中图标资源文件夹[ztree\css\zTreeStyle\img]拷贝DWZ的themes\css目录。如图:
?
3.2:Js脚本修改:
Dwz.ui.js注释initUI函数中以下代码段:
//$("ul.tree", $p).jTree();
jquery.ztree.core-3.5.js有多次需要修改,按如下步骤调整:
makeDOMNodeNameBefore函数:
??? if (node.rel) {
??? //alert(node.name+".rel="+node.rel);
?? html.push(" rel='", node.rel,"'");
??? }
makeNodeTarget函数修改:
return (node.target || "navTab");
添加setNodeRel函数:
setNodeRel: function(setting, node) {
??? var aObj = $("#" + node.tId + consts.id.A),
??? rel = treeNode.rel;
??? if (rel == null || rel.length == 0) {
??? aObj.removeAttr("rel");
??? } else {
??? aObj.attr("rel", rel);
??? }
??? }
updateNode函数调用setNodeRel函数
view.setNodeRel(setting, node);
4.前端应用
页面引用jquery.ztree.core-3.5.js;
Js代码段:
?
?
Html代码段:
?