jsTree：如何将选定节点的 ID 获取到 jsTree 中的根节点？

Posted 2023-05-08

【中文标题】jsTree：如何将选定节点的 ID 获取到 jsTree 中的根节点？

【英文标题】：jsTree : How to get IDs of selected nodes to root node in jsTree?

【发布时间】：2012-04-25 18:31:39

【问题描述】：

jsTree中如何获取选定节点的ID到根节点？

假设 C 是选定节点，那么我如何获取 C 的所有父 ID。

一个

B

C

+C1

+c2

以下代码将仅返回直接父 ID： 如果我选择 C 那么我只会得到 B

 .bind("select_node.jstree", function (event, data)   
    //`data.rslt.obj` is the jquery extended node that was clicked          
    alert("Selected node = "+ data.rslt.obj.attr("id"));
    alert("Parent of Selected node = "+ data.inst._get_parent(data.rslt.obj).attr("id"))
 );

输出：

Selected node = C

Parent of Selected node = B

有什么方法可以获取所有父节点 ID，即选定节点到根节点？

如何获取jsTree中选中节点的所有子节点？

在此问题上的任何帮助或指导将不胜感激。

【参考方案1】：

在 jQuery 中使用 parents 获取所有父项，通过 li 过滤掉，因为所有树项在 jstree 中都是 li，试试这个：

var parents = data.rslt.obj.parents("li");

对于儿童，在 jQuery 中使用 children，如下所示：

var children = data.rslt.obj.parent().find('li');

EDIT 使用上面的方法，这里是如何获取所有的父母和孩子，并将它们放在一个数组中：

家长：

var parents = [];
data.rslt.obj.parents("li").each(function () 
    parents.push( id: $(this).attr("id"), description: $(this).children("a").text() );
);

儿童：

var children = [];
data.rslt.obj.find("li").each(function () 
    children.push( id: $(this).attr("id"), description: $(this).children("a").text() );
);

【讨论】：

感谢 mattytommo 的回复。父母列表返回 [object htmlLIElement]。如何获取该“对象 HTMLLIElement”的 ID 和文本？

您想要所有父母的 ID 还是只想要直系父母的 ID？让我知道，我会更改我的代码:)

mattytommo :) 如果用户选择了“C”，那么我应该获取所有父节点的所有 ID 和节点值（文本），即（B，A）。我正在jstree中实现双树。如果用户从左树中选择了节点（叶子/非叶子），那么我想在特定事件上将所选节点的层次结构复制到左树中的根节点。

var children = data.rslt.obj.children("li") 不返回所选节点的子节点。 children.lenght=0 总是请检查

检查我的编辑，获取你所有的孩子，并通过 id 和 text 将它们放入一个数组中，父母也一样。

【参考方案2】：

1 更简单的解决方案

 .get_path ( node , id_mode )

以 ID 数组或节点名称数组的形式返回节点的路径。 混合节点：这可以是 DOM 节点、jQuery 节点或指向树中的元素的选择器，我们想要其路径。bool id_mode：如果设置为 true，则返回 ID 而不是父节点的名称。默认为假。

// To get path [ID or Name] from root node to selected node 

var ids = data.inst.get_path('#' + data.rslt.obj.attr('id'),true);

// Returns IDs from root to selected node

var names = data.inst.get_path('#' + data.rslt.obj.attr('id'),false); 

// Returns Name's from root to selected node 

alert("Path [ID or Name] from root node to selected node = ID's = "+ids+" :: Name's = "+names);

【讨论】：

优秀。正是我需要的。我想要任何选定节点的根节点的文本，所以我只使用了data.inst.get_path(data.rslt.obj)[0]

使用 data.instance 而不是 data.inst 让它与 jsTree 3 一起工作。感谢您的帮助！