zTree 是一個依靠 jQuery 實現的多功能 「樹插件」。以下透過本文給大家分享jQuery zTree 非同步載入新增子節點重複問題,需要的朋友參考下吧
##zTree 簡介
zTree 是一個依靠jQuery 實現的多功能「樹插件」。優異的性能、靈活的配置、多種功能的組合是 zTree 最大優點。 zTree 是開源免費的軟體(MIT 許可證)。如果您對 zTree 感興趣或願意資助 zTree 繼續發展下去,可以進行捐款。原始問題#
//添加结点, 产品和版本 function addNode(event) { rMenu.css({ "visibility": "hidden" }); var treeNode = zTree.getSelectedNodes()[0]; var pid; var nodeName; var treelevel; if (!treeNode && event.target.tagName.toLowerCase() != "button" && $(event.target).parents("a").length == 0) { //添加产品结点 pid = 0; treeNode = null; treelevel = 1; } else if (treeNode) { //添加版本结点 pid = treeNode.id; treelevel = 2; } $.post( "AddNode.action", { type: treelevel, id: pid }, function(nodeIdAndName) { var params = /([^\|]+)\|([^\|]+)/.exec(nodeIdAndName); if (!((!treeNode && event.target.tagName.toLowerCase() != "button" && $(event.target).parents("a").length == 0) || treeNode.open)) { zTree.expandNode(treeNode, true); } treeNode = zTree.addNodes(treeNode, { id: params[1], pid: pid, isParent: "true", name: params[2], editable: "true", treelevel: treelevel }); }); }原本直接加入子節點的時候,如果父節點沒有展開,會增加兩個一樣的子節點(第一次的時候);後來我對父節點是否展開進行了判斷,但是卻變成瞭如果父節點展開,會增加兩個一樣的子節點(第一次的時候),這個問題要怎麼解決呢?
辦法一
將if (!((!treeNode && event.target.tagName.toLowerCase() != "button" && $(event.target).parents("a").length == 0) || treeNode.open)) { zTree.expandNode(treeNode, true); } treeNode = zTree.addNodes(treeNode, { id: params[1], pid: pid, isParent: "true", name: params[2], editable: "true", treelevel: treelevel });改成
if(!treeNode && event.target.tagName.toLowerCase() != "button" && $(event.target).parents("a").length == 0) { treeNode = zTree.addNodes(treeNode, { id: params[1], pid: pid, isParent: "true", name: params[2], editable: "true", treelevel: treelevel }); } else if(treeNode.open) { if(treeNode.isParent) { zTree.reAsyncChildNodes(treeNode, "refresh"); } else { treeNode.isParent=true; zTree.reAsyncChildNodes(treeNode, "refresh"); } } else { zTree.expandNode(treeNode, true); treeNode = zTree.addNodes(treeNode, { id: params[1], pid: pid, isParent: "true", name: params[2], editable: "true", treelevel: treelevel }); }問題就可以解決了,但是有沒有優化呢?感覺改後的程式碼分類太多了
最優辦法
#似乎不用這麼麻煩吧?前兩天回答了類似的問題。 1、點擊新增子節點後,直接ajax 傳給後台保存數據,擷取success 事件2、ajax success 時,利用treeNode.zAsync 屬性就可以知道此父節點是否進行過異步加載,如果為false 那麼直接reAsyncChildNodes 刷新, 如果為true 那麼利用addN...if ((!treeNode && event.target.tagName.toLowerCase() != "button" && $(event.target).parents("a").length == 0) || treeNode.zAsync) treeNode = zTree.addNodes(treeNode, { id: params[1], pid: pid, isParent: "true", name: params[2], editable: "true", treelevel: treelevel }); else zTree.reAsyncChildNodes(treeNode, "refresh");上面是我整理給大家的,希望今後會對大家有幫助。 相關文章:
以上是使用zTree非同步載入(詳細教學)的詳細內容。更多資訊請關注PHP中文網其他相關文章!