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

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树控件(基于jQuery, 超剽悍)[推荐]

 

        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 

1 楼 a3mao 2009-04-17  
似乎跟xloadtree很类似
2 楼 joeytang 2009-07-22  
你好,jstree能够局部装载节点吗?
即 树的所有节点并不是一下子全装载的,而是点击某个节点后,再动态的装载该节点的子节点,然后显示。
不知道jstree有这个功能没。
3 楼 zhanjia 2009-07-25  
joeytang 写道
你好,jstree能够局部装载节点吗?
即 树的所有节点并不是一下子全装载的,而是点击某个节点后,再动态的装载该节点的子节点,然后显示。
不知道jstree有这个功能没。

可以,不过不太完善。
4 楼 pistachio 2009-08-03  
你好,我想问下,这个树的效率如何?如果异步装载不太完善的话,这个树会不会很慢?
5 楼 zhanjia 2009-08-05  
pistachio 写道
你好,我想问下,这个树的效率如何?如果异步装载不太完善的话,这个树会不会很慢?


感觉效率还可以吧
不过我目前用的节点不是很多,多得话就不知道了
效率影响主要是节点图标的加载,只要网速不要太慢,或者是内网的话应该没问题
6 楼 tanzhengping11 2010-03-24  
请问有没有实现好的实例。本人会用啊,学习中
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",
8 楼 just4you 2010-09-13  
用的1.0版本的,好多东西不会用啊,看例子看不懂。烦起jsTree树控件(基于jQuery, 超剽悍)[推荐]