如何获取 jsTree 中选定节点的 id？答案

【问题标题】：How do I get the id of the selected node in jsTree?如何获取 jsTree 中选定节点的 id？
【发布时间】：2010-04-06 14:22:28
【问题描述】：

如何在jsTree 中获取所选节点的 ID？

function createNewNode() {
  alert('test');
  var tree = $.tree.reference("#basic_html");
  selectedNodeId = xxxxxxxxx; //insert instruction to get id here
  tree.create({ data : "New Node Name" }, selectedNodeId);
}

【问题讨论】：

标签： javascript jquery jstree

【解决方案1】：

无法让 harpo 的解决方案发挥作用，也不愿意使用 Olivier 的解决方案，因为它使用内部 jsTree 函数，所以我想出了一个不同的方法。

$('#tree').jstree('get_selected').attr('id')

就这么简单。 get_selected 函数返回一个选定列表项的数组。如果您对该数组执行.attr，jQuery 将查看列表中的第一项。如果您需要多个选择的 ID，则将其视为数组。

【讨论】：

不知道为什么 data.rslt.obj.attr("id") 在这里不起作用（如果您在 onselect 处理程序中有数据作为参数），但这可以解决问题并完成>1 小时搜索解决方案 - 谢谢！
绝对是正确的解决方案。
我这不起作用，因为 .attr 未定义。这是因为没有加载 jQuery 吗？ $('#tree').jstree('get_selected') 确实返回了所选节点的 id 数组
没有完成这项工作，因为 mmcrae 提到它是未定义的。对我来说诀窍是 $('#tree').jstree('get_selected').toString();
在最新版本的jsTree中，代码$('#tree').jstree('get_selected')实际上返回的是一个ID数组，而不是节点。要获取节点数组，请使用$('#tree').jstree('get_selected', true)。上面的答案在最新版本的 jsTree 中不起作用。请参阅current documentation 了解更多信息。

【解决方案2】：

jsTree 中的节点本质上是包装好的列表项。这将为您提供第一个的参考。

var n = $.tree.focused().get_node('li:eq(0)')

如果您有对树的引用，您可以替换 $.tree.focused()。

要获取id，取第一个匹配的元素

if (n.length)
    id = n[0].id

或者你可以使用 jQuery attr 函数，它作用于集合中的第一个元素

id = n.attr('id');

【讨论】：

【解决方案3】：

在jstree版本3.1.1，可以直接从get_selected获取：

$("#<your tree container's id>").jstree("get_selected")

【讨论】：

您的答案是 100% 正确的。对于其他人，'get_selected' 方法不会获取节点，而是获取节点的 id。您可以通过调用方法“get_node”来使用 id 获取节点 - 例如。 var node = $("#myelement").jstree("get_node", nodeId);

【解决方案4】：

在最新版本的 jsTree（在 3.3.3 中检查）中，您可以这样做来获取 ID 数组：

var ids = $('#tree').jstree('get_selected');

这将返回，例如，["selected_id1", "selected_id2", "selected_id3"]。如果你想得到选中的nodes（不是ID），你可以这样做：

var nodes = $('#tree').jstree('get_selected', true);

current docs 包含更多信息。

【讨论】：

我不知道获取实际节点的参数 'true'。酷 - 谢谢！

【解决方案5】：

  $.jstree._reference('#my_tree_container')._get_node(null, true).each(function() {
    id = $(this).attr("id");
    alert('Id selected: ' + id);        
  });

【讨论】：

【解决方案6】：

我在从具有多个选择的树中获取选定的 ID 时遇到问题。这就是我得到它们的方式：

var checked_ids = [];
$("#your-tree-id").jstree('get_selected').each(function(){    
      checked_ids.push($(this).data('id'));                         
});

【讨论】：

【解决方案7】：

就我而言，数据调用不起作用。我使用 attr 函数成功访问了我的节点数据。

$("#tree").jstree("get_selected").attr("my-data-name");

【讨论】：

【解决方案8】：

要获取所有选定的 ID，请使用以下代码

var selectedData = [];
var selectedIndexes;
 selectedIndexes = $("#jstree").jstree("get_selected", true);
jQuery.each(selectedIndexes, function (index, value) {
     selectedData.push(selectedIndexes[index].id);
 });

现在您在“selectedData”变量中拥有所有选定的 ID

【讨论】：

【解决方案9】：

使用最新版本的 Jstree；你可以这样做：

<script type="text/javascript>
    var checked_ids = [];
    $('#your-tree-id).jstree("get_checked",null,true).each(function(){
        checked_ids.push(this.id);
    });
    alert(checked_ids.join(","));
</script>

【讨论】：

【解决方案10】：

<script type="text/javascript>
    checked_ids.push($(this).context.id);
</script>

【讨论】：

【解决方案11】：

随便用

var nodeId = $('#FaqTreeView').jstree().get_selected("id")[0].id;

#FaqTreeView 是包含 jstree 的 div 的 id。

【讨论】：

【解决方案12】：

在某些情况和/或 jstree 版本中，此解决方案不起作用。

$('#tree').jstree('get_selected').attr('id');

我没有得到任何定义的“id”。我的诀窍是：

$("#tree").jstree("get_selected").toString();

【讨论】：

【解决方案13】：

这些都是旧版本的旧答案。从 3.3.3 版本开始，这将用于获取所选节点的所有属性。

$('#jstree').jstree().get_selected(true)[0]

如果您想要该 id，请在末尾添加 .id。如果您复制上述代码，您可以查看 Web 开发人员工具中的所有其他属性。

【讨论】：

【解决方案14】：

您可以使用以下代码 var nodes = $("#jstree_demo_div").jstree(true).get_selected("full", true);//选中节点列表

nodes[0].id//这将给出数组中第一个对象的id

【讨论】：