如何以编程方式在jsTree中选择节点并打开所有父节点

时间:2012-08-17 22:04:45

标签: javascript jquery jquery-ui jstree

在多级jsTree中,如何选择特定节点(可能是叶节点)并展开其所有父节点? 例如:
从这个JSFiddle(http://jsfiddle.net/mmeah/fyDE6/)我想以编程方式选择Grand Child并打开所有父节点。

对于某些上下文,我试图确保用户返回树中的正确节点,如果他们跟随我的网站的深层链接

2 个答案:

答案 0 :(得分:5)

jsTree给出一个open_node()函数来任意触发任何节点打开。只需扫描树中的非开放父母并打开它们。

实施例: http://jsfiddle.net/mmeah/yyy8W/

$("#findChild").click(function(){
    $.jstree._reference(myTree).open_node("#Node_001",function(){;},false);
});
$("#findGrandChild").click(function(){
    var closedParents = $("#Node_003").parents("li.jstree-closed");
    for(var i=closedParents.length-1;i>=0;i--){
        pleaseOpen($(closedParents[i]));
    }
});

function pleaseOpen(thisNode){
    if(typeof thisNode=="undefined") return;
    if(thisNode.hasClass("jstree-leaf") || thisNode.hasClass("jstree-open") ) return;
    $.jstree._reference(myTree).open_node(thisNode,function(){;},true);
}

答案 1 :(得分:2)

啊哈,我在正确的轨道上但是我的深层连接解析代码和树的构造之间存在竞争条件

选择节点并触发事件

$("#tree").jstree("select_node", selector).trigger("select_node.jstree");

在树加载后执行此操作以使其正常工作...

$("#tree").jstree(...).bind("loaded.jstree", function () 
{
    $("#tree").jstree("select_node", selector).trigger("select_node.jstree");
});