快捷導(dǎo)航

Easyui Tree獲取當(dāng)前選擇節(jié)點(diǎn)的所有頂級(jí)父節(jié)點(diǎn)

更新時(shí)間：2017年02月14日 10:42:25 投稿：mrr

這篇文章主要介紹了Easyui Tree獲取當(dāng)前選擇節(jié)點(diǎn)的所有頂級(jí)父節(jié)點(diǎn),以及easyUI Tree顯示選中節(jié)點(diǎn)的所有父節(jié)點(diǎn)的實(shí)現(xiàn)代碼，需要的朋友可以參考下

只支持四層目錄結(jié)構(gòu)，比較笨的一個(gè)方法

JS代碼

var node = $('#tree').tree('getSelected'); 
 //獲取該節(jié)點(diǎn)所有父節(jié)點(diǎn) 
           var parentAll = node.text; 
           var flag = ">>"; 
           parentAll = flag.concat(parentAll); 
           var parent = $('#tree').tree('getParent', node.target); 
           if(parent != null && parentOne != ''){ 
              parentAll = (parent.text).concat(parentAll); 
              var parentOne = $('#tree').tree('getParent', parent.target); 
              if(parentOne != null && parentOne != ''){ 
                parentAll = flag.concat(parentAll); 
                parentAll = (parentOne.text).concat(parentAll); 
                var parentTwo = $('#tree').tree('getParent', parentOne.target) 
                if(parentTwo != null && parentTwo != ''){ 
                  parentAll = flag.concat(parentAll); 
                  parentAll = (parentTwo.text).concat(parentAll); 
                } 
              } 
           } 
           $("#path").text(parentAll);

JSP頁(yè)面代碼

<span style="font-size:12px;font-weight:bold;">當(dāng)前節(jié)點(diǎn):<b id="path"></b></span>

下面看下easyUI Tree顯示選中節(jié)點(diǎn)的所有父節(jié)點(diǎn)

功能需要，顯示Tree上所選節(jié)點(diǎn)的所有父節(jié)點(diǎn)，如圖：

這里寫圖片描述

代碼實(shí)現(xiàn)如下：

var str = "";
 var parentAll = "";
 parentAll = node.text;
 parentAll = parentAll.replace(/\[[^\)]*\]/g, ""); //獲得所需的節(jié)點(diǎn)文本
 var flag = ",";
 var parent = $('#leftTree').tree('getParent', node.target); //獲取選中節(jié)點(diǎn)的父節(jié)點(diǎn)
 for (i = 0; i < 6; i++) { //可以視樹的層級(jí)合理設(shè)置I
   if (parent != null) {
     parentAll = flag.concat(parentAll);
     str = (parent.text).replace(/\[[^\)]*\]/g, "");
     parentAll = (str).concat(parentAll);
     var parent = $('#leftTree').tree('getParent', parent.target);
   }
 }
alert(parentAll);

結(jié)果顯示：

這里寫圖片描述

總結(jié)：其實(shí)原理很簡(jiǎn)單，就是獲取當(dāng)前選中節(jié)點(diǎn)的父節(jié)點(diǎn)，然后通過(guò)循環(huán)，再求父節(jié)點(diǎn)的父節(jié)點(diǎn)。通過(guò)這個(gè)功能的實(shí)現(xiàn)，也見識(shí)到了查看API的好處！

您可能感興趣的文章: