簡介

zTree 是利用 JQuery 的核心代碼，實現一套能完成大部分常用功能的 Tree 插件

• 兼容 IE、FireFox、Chrome 等瀏覽器
• 在一個頁面內可同時生成多個 Tree 實例
• 支持 JSON 數據
• 支持一次性靜態生成 和 Ajax 異步加載 兩種方式
• 支持多種事件響應及反饋
• 支持 Tree 的節點移動、編輯、刪除
• 支持任意更換皮膚 / 個性化圖標（依靠css）
• 支持極其靈活的 checkbox 或 radio 選擇功能
• 簡單的參數配置實現 靈活多變的功能

引言

今天開發的時候，因為需求需要實現同一個頁面左右兩棵樹，如果選中某一棵樹的某一個節點，相應的另一顆樹的該節點也被選中。（兩棵樹是有關聯的。當然可以根據自己需要改變聯動條件和方式）。

此處不再粘貼實現樹的代碼，僅僅展示實現聯動的方法。

效果如圖：

效果圖

代碼：

function linkageTreeClick(event, treeId, treeNode) {  var param = treeNode.id; //獲得點擊樹的ID  var otherTree = $.fn.zTree.getZTreeObj(treeId);  // 選取樹的所有節點  var nodes = otherTree.getNodesByParam(param);  //遍歷樹的節點  for (var i in nodes) {   if(param==nodes[i].id){    otherTree.selectNode(nodes[i]);    return;   }  } }

其中treeId為你想與之聯動的樹的ID，將該方法在zTree的onclick方法中進行調用，根據自己情況，傳入參數，然后實現聯動。

方法selectNode()參數為樹的節點，作用為：使該節點被選中。

總結

以上就是這篇文章的全部內容了，希望本文的內容對大家的學習或者工作具有一定的參考學習價值，如果有疑問大家可以留言交流，謝謝大家對武林網的支持。