如何在jsTree中双击打开/关闭节点 [英] how to open/close nodes on double/single click in jsTree

查看:75
本文介绍了如何在jsTree中双击打开/关闭节点的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

如何双击或双击节点名称打开/关闭节点?就像在这里第一个树示例一样-但是有使用过的jsTree 0.9.8

how can I open/close nodes on double or single click of the node name? Like it works here the first tree sample - but there is used jsTree 0.9.8

-

<html>
<head>
<title> dashboard</title>

<script type="text/javascript" src="_lib/jquery.js"></script>
<script type="text/javascript" src="jquery.jstree.js"></script>
<script type="text/javascript" src="_lib/jstreegrid.js"></script>
<script type="text/javascript">
//<![CDATA[

$(document).ready(function(){

var data = [{
       data: "basics",
       attr: {SOF: "<a href=\"http://www.w3schools.com\">Visit W3Schools.com!</a>"},  
        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: "<a href=\"http://www.w3schools.com\">Visit W3Schools.com!</a>"}}
          ]

         }
        ]
      }];
$("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
};
}
}
});
});
//]]>
</script>
</head>
<body>
<div id="jstree"></div>

</body>
</html>

推荐答案

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

One way is to enable the types and ui plugins and define a select_node event handler on the default type like so:

   $(element)
        .jstree({ 
            "types" : { 
                "types" : { 
                    "default" : { 
                        "select_node" : function(e) {
                                            this.toggle_node(e);
                                            return false;
                                        } 

                    }
                } 
             },
             "plugins" : [ "themes", "html_data","types", "ui" ] });

这篇关于如何在jsTree中双击打开/关闭节点的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆