jstree jquery插件 - 获取父节点的所有子节点和子子节点答案

【问题标题】：jstree jquery plugin - Get all child and sub child nodes of parentjstree jquery插件 - 获取父节点的所有子节点和子子节点
【发布时间】：2012-07-16 20:15:03
【问题描述】：

我正在使用jsTree jquery plugin

我正在尝试获取选定父节点的所有节点和子节点。但不知何故，除非我使用递归，否则它不起作用。 jsTree 有没有更好的方法？

【问题讨论】：

P.S. - 我已经在这里回答了我的问题。

标签： javascript jquery-plugins jstree

【解决方案1】：

您可以使用此选择器获得全部树：$("#demo1").find("li > a")

【讨论】：

谢谢@fliespl，但我只需要给定父节点的子节点。我想出了一个办法。我将在测试后尽快发布答案。

【解决方案2】：

我尝试了以前的解决方案，但它不适用于最新版本的 jsTree (v3.2.1)。以下是获取父节点的子节点和子节点的更新解决方案。

$("#myTree").bind('selected_node.jstree', function (node, data) {
    var selectedNodes = $("#myTree").jstree(true).get_json(data.node.id, { flat: true });
    for (var i = 0; i < selectedNodes.length; i++) {
       // Apply logic here
       // ...
       // ...
       // ...
    }
});

【讨论】：

【解决方案3】：

我找到了一种方法来做到这一点。就我而言，我使用 xml 作为树的数据源。我通过以下方式将 open_node 事件绑定到 jstree。请注意，即使我使用的是 xml，内部结构也是 html 数据的结构。

// jsTree Configuration hash
var jsTreeConfig = {};

$("#demo1").jstree( jsTreeConfig )
            .bind('open_node.jstree', function( e, data ) {
                var parentObj = data.rslt.obj; // parent object
                var jstreeInstance = data.inst; // jstree instance
                $(data.rslt.obj).find("li").each( function( idx, listItem ) {
                    var child = $(listItem); // child object
                    // do Stuff with child which can be any level of hierarchy depth
                    // ...
                });
            });

【讨论】：

抱歉缩进不佳。 jstree({...}) 具有实例化 jstree 的所有选项。你需要预先加载 jQuery 才能工作。