使用jstree打開一個節點及其所有父節點

Question

我試圖使用jstree並在頁面打開時讓一個節點及其所有父節點打開。這是我用來測試的html代碼。

<div id="treeTask"> 
     <ul> 
      <li id="node_37"><a href="#">TEST1</a> 
       <ul> 
        <li id="node_38"><a href="#">TEST2</a></li> 
        <li id="node_39"><a href="#">TEST3</a></li> 
       </ul> 
      </li> 
     </ul> 

     <ul> 
      <li id="node_3"><a href="#">TEST1</a> 
       <ul> 
        <li id="node_4"><a href="#">TEST2</a></li> 
        <li id="node_6"><a href="#">TEST3</a></li> 
       </ul> 
      </li> 
     </ul> 
    </div> 

這裏是調用初始化jstree並打開節點。

$(function() { 
     $("#treeTask").jstree(); 

     $("#treeTask").bind("ready.jstree", function (event, data) { 
      $("#treeTask").jstree("open_node", $("#node_4")); 

      if((data.inst._get_parent(data.rslt.obj)).length) { 
       data.inst._get_parent(data.rslt.obj).open_node(this, false); 
       } 
     }); 

    }); 

我一直在操作代碼一段時間，但無法使其工作。如果有人能幫忙，我會很感激。

非常感謝！

Answer 1

您可以使用內置的_open_to功能：
http://www.jstree.com/api/#/?q=open_to&f=_open_to%28obj%29

$("#treeTask").jstree().bind('ready.jstree', function (event, data) { 
    data.instance._open_to('node_4'); 
}); 

Answer 2

也許這是你的問題的解決方案：

fiddle

$("#treeTask").jstree().bind('ready.jstree', function (event, data) { 
$("#treeTask").jstree('open_node', 'node_4', function(e,d) { 
    if(e.parents.length){ 
     $("#treeTask").jstree('open_node', e.parent); 
    }; 
    }); 
}); 

Answer 3

基於@maddin的解決方案，我已經更新了它支持任意數量的父級。

jsFiddle

$("#treeTask").jstree().bind('ready.jstree', function (event, data) { 
    $("#treeTask").jstree('open_node', 'node_4', function(e,d) { 
    for (var i = 0; i < e.parents.length; i++) { 
     $("#treeTask").jstree('open_node', e.parents[i]); 
    }; 
    }); 
}); 

應當注意的是，如果選擇一個節點，它的所有的父母會自動打開。這將在一定程度上相當於上面：

$("#treeTask").jstree().bind('ready.jstree', function (event, data) { 
    $("#treeTask").jstree('select_node', 'node_4'); 
});