在jstree中，如何将指定的节点集中到大型树上

In jstree how to bring a specified node into focus on a large tree?

本文关键字：集中 节点 大型 jstree      更新时间：2023-09-26

我有一个大型的jstree结构来实现分类管理器。通过id打开特定节点没有问题：treeElement.jstree（'open_node'，nodeId）；

我写了一个搜索框，当我从搜索下拉列表中选择一个项目时，它会打开该项目的编辑框。然而，在左侧面板下方的视图中仍然存在的树并没有集中在该项目上。我可以打开选定的节点，但它可能在屏幕外，因为它可能在树的不同部分，与当前可见的选择不同（都在一个大滚动区域中）。

我的问题：如何使树集中在所需的节点上？用户需要实际查看所选节点在树中的位置。我不想非得上下滚动才能找到它。这看起来很标准，但我在任何地方都找不到答案。谢谢

使用get_node函数，将asDom参数设置为true，然后聚焦，如下所示：

treeElement.jstree(true).get_node(nodeId, true).children('.jstree-anchor').focus();

请记住，节点必须是可见的（在DOM中）才能工作。

如果节点不可见（其父节点之一已关闭），则可以使用内部_open_to函数来显示它（也可以将其集中在此处以保持简单）：

treeElement.jstree(true)._open_to(nodeId).focus();

谨致问候，Ivan

我知道，当您从下拉列表中选择一个节点时，您也希望实际看到它。你试过使用jQuery.focus（）吗？

$( "#dropdown-item" ).click(function() {
  $( "#nodeId" ).focus();
});

1-在jstree的核心必须添加（"animation"：0）

"core": {
    "initially_open": ["phtml_1"],
    "rtl": true,
    "animation": 0
},

2-选择节点：

var str1 ='mynodeid';
$("#demo1").jstree('select_node', "#" + str1 );

3-in-bind Select_node函数：

.bind("select_node.jstree", function (event, data) {
    data.inst._fix_scroll(data.rslt.obj);
}

var secectedNode=$('[aria-selected="true"]')
if(secectedNode.length==0)
  return;
secectedNode[0].focus();
相关文章：