如何在jsTree中双击/单击打开/关闭节点

如何在双击或单击 节点名称时 打开/关闭节点? 就像它在这里工作的第一个树样本 – 但是使用了jsTree 0.9.8

  • 使用jsTree 1.0rc2

   dashboard     //<![CDATA[ $(document).ready(function(){ var data = [{ data: "basics", attr: {SOF: "Visit W3Schools.com!"}, children: [ {data: "login", attr: {run: "run"}, children: [ {data: "login", attr: {}} ] } , {data: "Academic Year", attr: {run: "run"}, children: [ {data: "login", attr: {}}, {data: "Academic Year", attr: {filter: "mini", SOF: "Visit W3Schools.com!"}} ] } ] }]; $("div#jstree").jstree({ plugins: ["themes","json_data","grid","dnd"], json_data: {data: data}, grid: { columns: [ {width: 220, header: "Group"}, {cellClass: "col2", value: "run", width: 40, header: "run"}, {cellClass: "col3", value: "filter", width: 40, header: "filter"}, {cellClass: "col4", value: "SOF", width: 450, header: "SOF"} ] }, dnd: { drop_finish : function () { }, drag_finish : function () { }, drag_check : function (data) { return { after : true, before : true, inside : true }; } } }); }); //]]>    

一种方法是启用类型和ui插件,并在默认类型上定义一个select_node事件处理程序,如下所示:

  $(element) .jstree({ "types" : { "types" : { "default" : { "select_node" : function(e) { this.toggle_node(e); return false; } } } }, "plugins" : [ "themes", "html_data","types", "ui" ] }); 

除了传统知识的正确答案……

单击具有href属性的树项(由JSON,XML数据或直接在HTML中设置)时,此解决方案将中断导航。

要解决此问题,在叶子配置“类型”(锚点必须触发导航)中设置此处理程序:

 "select_node": function (e) { document.location = e.children("a").attr("href"); return false; } 

在创建树时,您不必添加clickable: [...]选项吗?

 $('#domainvariants').jstree({ plugins : ["themes","html_data","ui","crrm"] }).bind("select_node.jstree", function (event, data) { return data.instance.toggle_node(data.node); });