jsTree树控件(基于jQuery, 超强悍)[推荐]

jsTree是基于javascript的一个跨浏览器树控件，功能强大，而且是免费的。

1、支持基于HTML定义、Json、XML方式加载树节点

2、支持拖放，动态增加、删除、重命名树节点

3、支持复选框

4、支持复制、剪切、粘贴树节点，动态刷新树

5、提供足够的回调方法：

        beforechange:function(){ log("About to change");return true},
        beforeopen  :function(){ log("About to open");return true},
        beforeclose :function(){ log("About to close");return true},
        beforemove  :function(){ log("About to move");return true}, 
        beforecreate:function(){ log("About to create");return true}, 
        beforerename:function(){ log("About to rename");return true}, 
        beforedelete:function(){ log("About to delete");return true}, 
        onselect    :function(){ log("Select");},
        ondeselect  :function(){ log("Deselect");},
        onchange    :function(){ log("Focus changed");},
        onrename    :function(){ log("Rename");},
        onmove      :function(){ log("Move");},
        oncopy      :function(){ log("Copy");},
        oncreate    :function(){ log("Create");},
        ondelete    :function(){ log("Delete");},
        onopen      :function(){ log("Open");},
        onopen_all  :function(){ log("Open ALL");},
        onclose     :function(){ log("Close");},
        error       :function(){},
        ondblclk    :function(){ log("Doubleclick"); TREE_OBJ.toggle_branch.call(TREE_OBJ, NODE); TREE_OBJ.select_branch.call(TREE_OBJ, NODE);},
        onrgtclk    :function(){ log("Rightclick");},
        onload      :function(){ log("Tree loaded");},
        onfocus     :function(){ log("Tree got focus");},
        ondrop      :function(){ log("Foreign node dropped");}

6、此外，还提供了详细的使用文档

        jsTree is a javascript based, cross browser tree component. It uses jQuery and Sarissa (optionally). jsTree is absolutely free (licensed same as jQuery - under both GPL and MIT - whichever suits your needs).

Currently supported browsers are: Internet Explorer 6 +, Mozilla Firefox, Safari 3, Opera 9+, Google Chrome. The latter three are not thoroughly tested. jsTree may also work with other browsers - please drop me a note if you performed some tests.

 

Key features

• Data sources:
  • predefined HTML - convert nested lists into a tree on the fly
  • JSON - provide a json object
  • XML - provide a nested structure or a flat (id -> parent_id) one
• Async loading - just provide an URL and the tree will request data as needed (works for XML & JSON sources)
• Open, close, rename, create, delete nodes (all with definable rules)
• Various callbacks (onchange, oncreate, ondelete, onload, etc …)
• Drag & drop support (definable with rules)
• Multiple select
• Localization - maintain the same tree in as many languages as you like
• Right-to-left support (supported in both supplied themes)
  
• Theme support (change icons, sizes, backgrounds, etc …)
• Animated open & close (configurable)
• Optional keyboard navigation
• multitree support - move/copy nodes form to tree to tree (definable with rules)
• also works as a jQuery plugin

 

下载地址：http://code.google.com/p/jstree/
文档：http://jstree.com/reference/_documentation/1_files.html
例子：http://jstree.com/reference/_examples/1_datasources.html 

评论

8 楼 just4you 2010-09-13  

用的1.0版本的，好多东西不会用啊，看例子看不懂。烦起

7 楼 java032 2010-05-28  

jstree version 0.9.9a2 (for jquery 1.4)
ie bug
大家有没有遇到啊
ie 报错为
Message: System error: -2146697210.
sarissa.js


用的是type : "xml_flat",

6 楼 tanzhengping11 2010-03-24  

请问有没有实现好的实例。本人会用啊，学习中

5 楼 zhanjia 2009-08-05  

pistachio 写道

你好，我想问下，这个树的效率如何？如果异步装载不太完善的话，这个树会不会很慢？

感觉效率还可以吧
不过我目前用的节点不是很多，多得话就不知道了
效率影响主要是节点图标的加载，只要网速不要太慢，或者是内网的话应该没问题

4 楼 pistachio 2009-08-03  

你好，我想问下，这个树的效率如何？如果异步装载不太完善的话，这个树会不会很慢？

3 楼 zhanjia 2009-07-25  

joeytang 写道

你好，jstree能够局部装载节点吗？
即 树的所有节点并不是一下子全装载的，而是点击某个节点后，再动态的装载该节点的子节点，然后显示。
不知道jstree有这个功能没。

可以，不过不太完善。

2 楼 joeytang 2009-07-22  

你好，jstree能够局部装载节点吗？
即 树的所有节点并不是一下子全装载的，而是点击某个节点后，再动态的装载该节点的子节点，然后显示。
不知道jstree有这个功能没。

1 楼 a3mao 2009-04-17  

似乎跟xloadtree很类似