单击父级时展开jsTree节点

Question

我正在尝试使用jsTree实现一个非常简单的树。我发现文档密集而且势不可挡。

现在，我点击此处显示的箭头展开/折叠节点：

我希望能够通过单击节点名称来扩展/折叠：

我使用的代码很简单;我没有改变jsTree的javascript：

<ul id="tree">
   <li>
      SubFolder1
      <ul id="tree">
         <li data-jstree='{"icon":"/Images/blue-folder.png"}'>Pub 1</li>
      </ul>
   </li>
</ul>

Answer 1

#slider1_container

这对我有用。奥尔斯解决方案没有。

Answer 2

只需在html文件中添加一个事件监听器并调用toggle_node函数即可。下面的代码只需单击一下即可。

$(document).ready(function(){
  $('#jstree_div').on("select_node.jstree", function (e, data) { $('#jstree_div').toggle_node(data.node); });
}

如果你想听双击，你需要另一个事件监听器，因为jsTree还不支持双击事件。

$('#jstree_div').on("dblclick",function (e) { 
  var li = $(e.target).closest("li");
  var node = $('#jstree_div').get_node(li[0].id);

  $('#jstree_div').toggle_node(node)
});

希望有所帮助。

Answer 3

$('#jstree').on("select_node.jstree", function (e, data) { 
     $('#jstree').jstree("toggle_node", data.node);
 });

这也可行

Answer 4

创建jsTree实例时，这是标准功能：

$('#jstree').jstree({
  "plugins" : [ "wholerow" ]
});

jsTree API

这将切换分支在整个行上点击的位置。