使用jstree打开一个节点及其所有父节点

Rya*_*yan 5 jstree

我正在尝试使用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>
Run Code Online (Sandbox Code Playgroud)

这是调用初始化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); 
              }  
        }); 

  });
Run Code Online (Sandbox Code Playgroud)

我一直在操纵代码,但无法使其工作.如果有人能提供帮助我真的很感激.

非常感谢!

vak*_*ata 10

您可以使用内置_open_to函数:http:
//www.jstree.com/api/#/?q = openn_to&f = _open_to%28obj%29

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


Goo*_*zak 5

基于@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]);
    };
  });
}); 
Run Code Online (Sandbox Code Playgroud)

需要注意的是,如果选择一个节点,它的所有父节点都会自动打开。这在某种程度上等同于上面的内容:

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