[英]How do I open all nodes in jquery Jstree?
我正在使用以下代码:
$("#treeview").jstree();
$("#treeview").jstree('open_all');
使用以下 html:
<div id="treeview">
<ul>
<li>
<a href="#">rubentebogt</a>
<ul>
<li>
<a href="#" onclick="goTo('index.php?module=alarm&pagina=dashboard&id=6',false);">Beneden</a>
</li>
<li>
<a href="#" onclick="goTo('index.php?module=alarm&pagina=dashboard&id=7',false);">Boven</a>
</li>
</ul>
</li>
</ul>
</div>
我的问题是所有节点都保持关闭状态,我无法使用jstree('open_all');
打开它们jstree('open_all');
.
jsTree 文档是“次优的”。 文档没有明确说明初始化是异步工作的。 有core.loaded() :
一个虚拟函数,其目的只是触发加载的事件。 在加载树的根节点之后,但在打开 initial_open 中设置的任何节点之前,会触发一次此事件。
这表明在设置树之后会触发一个事件loaded.jstree
。 您可以挂接到该事件以打开所有节点:
var $treeview = $("#treeview");
$treeview
.jstree(options)
.on('loaded.jstree', function() {
$treeview.jstree('open_all');
});
我正在使用 jstree 和 Chrome 的第 3 版。 加载的事件对我不起作用,但即使在创建 jstree 实例之后,就绪事件也起作用:
$('#treeview').on('ready.jstree', function() {
$("#treeview").jstree("open_all");
});
http://www.jstree.com/api/#/?q=.jstree%20Event&f=ready.jstree
如果要在加载树时打开所有节点:
$("#treeview")
// call `.jstree` with the options object
.jstree({
"plugins" : ["themes", "html_data","ui","crrm","sort"]
})
.bind("loaded.jstree", function (event, data) {
// you get two params - event & data - check the core docs for a detailed description
$(this).jstree("open_all");
})
});
以上所有答案都不适用于我的工作区。 我再次搜索并找到此链接( 为什么 jsTree open_all() 对我不起作用? )很有帮助,并发布了我的答案:
jstree 版本:3.0.0-bata10
$(document).ready(function() {
$("#tree").bind("loaded.jstree", function(event, data) {
data.instance.open_all();
});
$("#tree").jstree();
})
使用简单的代码
$(".jstree").jstree().on('loaded.jstree', function () {
$(".jstree").jstree('open_all');
})
使用 html 数据时,“您可以在任何 <li> 元素上设置 jstree-open 类以使其最初扩展,以便其子项可见。” - https://www.jstree.com/docs/html/
<li class="jstree-open" id="node_1">My Open Node</li>
我在这里尝试了所有答案,但它们不适用于 jsTree (v3.3.4)。 有效的是load_node.jstree
事件:
.on( 'load_node.jstree', function () {
jstree.jstree( "open_all" );
} )
您还可以将动画应用到打开和关闭,如下所示:
$(document)
.on("click", "#open-all-folders", function () {
// param1 set to null to open/close all nodes
// param2 is the duration in milliseconds
$("#tree-ref").jstree().open_all(null, 200);
})
.on("click", "#close-all-folders", function () {
$("#tree-ref").jstree().close_all(null, 200);
});
(或类似地适用于.on('ready.jstree', function() { // code here }
);
.bind("loaded.jstree", function (event, data) {
// you get two params - event & data - check the core docs for a detailed description
$(this).jstree("open_all");
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.