【轉】html樹形菜單控件

Query plugin: Treeview 

這個插件能夠把無序列表轉換成可展開與收縮的Tree。

 

主頁:http://bassistance.de/jQuery-plugins/jquery-plugin-treeview/

下載:http://jquery.bassistance.de/treeview/jquery.treeview.zip

示例:http://jquery.bassistance.de/treeview/demo/

 

 

jstree

 

 

jsTree是一個基於jQuery的Tree控件。支持XML，JSON，Html三種數據源。提供創建，重命名，移動，刪除，拖\放節點操作。可以自己自定義創建，刪除，嵌套，重命名，選擇節點的規則。在這些操作上可以添加多種監聽事件。 

 

主頁:http://code.google.com/p/jstree/

下載:http://jstree.googlecode.com/files/jsTree.v.0.9.6.zip

示例:http://jstree.com/jsTree/examples

 

FileTreePanel 

FileTreePanel擴展至Ext.tree.TreePanel附帶基本的文件/文件夾管理功能。其它還包括文件上傳，重命名，刪除，新建與移動。

 

 

主頁:http://extjs.com/learn/Extension:FileTree

下載:http://extjs.com/learn/Extension:FileTree

示例:http://aariadne.com/filetree

 

 

jQuery File Tree

 

jQuery File Tree是一個可配置的Ajax文件瀏覽器jQuery插件。可以通過CSS定制外觀，指定文件樹展開圖標，可以自己定義展開／收縮事件、速度，配置加載信息等。 jQuery File Tree通過Ajax來獲取文件信息。

 

主頁:http://abeautifulsite.net/notebook.PHP?article=58

下載:http://abeautifulsite.net/notebook_files/58/jqueryFileTree.zip

示例:http://abeautifulsite.net/notebook_files/58/demo/

 

 

dhtmlxTree  

dhtmlxTree是一個功能豐富的Tree Menu控件。提供豐富的操作API，AJAX支持和drag-n-drop功能。

 

 

主頁:http://dhtmlx.com/docs/products/dhtmlxTree/

下載:http://www.dhtmlx.com/docs/download/dhtmlxTree.zip

示例:http://dhtmlx.com/docs/products/dhtmlxTree/

dTree 

dTree是一個易於使用的JavaScript樹形菜單控件。支持無限分級，可以在同一個頁面中放置多個dTree，可以為每個節點指定不同的圖標。

 

主頁:http://destroydrop.com/javascripts/tree/default.html

下載:http://destroydrop.com/javascripts/tree/dtree.zip

示例:http://destroydrop.com/javascripts/tree/default.html

Yahoo! UI Library: TreeView 

YUI TreeView Control這個樹形組件，支持通過XMLHttpRequest對象動態加載節點數據，自定義每一個節點metadata。 

 

主頁:http://developer.yahoo.com/yui/treeview/

下載:http://developer.yahoo.com/yui/download/

示例:http://developer.yahoo.com/yui/examples/treeview/default_tree.html

 

 

Fonshen JS MenuTree

風聲JS菜單樹,程序基於JavaScript/XHTML/CSS標准實現。支持豐富的功能/表現定制：擁有表現和數據分離，單頁面可以應用多個無限級菜單樹，多達4種展開模式，風格樣式定義結構清晰、靈活又精細等等特性。

 

 

主頁:http://www.fonshen.com/MenuTree/

下載:p://www.fonshen.com/MenuTree/MenuTree.rar

示例:http://www.fonshen.com/MenuTree/demo/index.htm

 

 

Control.Treeview

采用Mootools開發的樹形菜單控件。支持通過Ajax動態獲取節點，設置默認選中某些節點。

 

 

主頁:http://meteora.astrata.com.mx/pages/demo/control-treeview

下載:http://meteora.astrata.com.mx/pages/demo/control-treeview

示例:http://meteora.astrata.com.mx/pages/demo/meteora-treeview

 

 

Folder Tree 

文件夾樹形控件。支持利用拖放（drag and drop）操作來重新排序節點，利用Ajax更新節點。

 

 

主頁:http://www.dhtmlgoodies.com/index.html?page=folderTree

下載:http://www.dhtmlgoodies.com/index.html?whichScript=drag-drop-folder-tree

示例:http://www.dhtmlgoodies.com/scripts/drag-drop-folder-tree/drag-drop-folder-tree.html

TafelTree-view 

TafelTree-view是一個基於Prototype與Script.aculo.us開發的樹形控件。支持拖放操作，Ajax更新節點等。

 

主頁:http://tafel.developpez.com/site/lang/en/samples.php

下載:http://prdownloads.sourceforge.net/tafeltree/tafelTree_1_9_1.zip?download

示例:http://tafel.developpez.com/site/lang/en/samples.php

 

 

DHTML Tree

這是一個基於標准<UL>Html結構構造的Tree控件。

 

 

主頁:http://www.javascripttoolbox.com/lib/mktree/

下載:http://www.javascripttoolbox.com/lib/mktree/

示例:http://www.javascripttoolbox.com/lib/mktree/

dFTree

dFTree是一個javascript+css Folder Tree支持利用Ajax技術動態新增/刪除/修改節點等功能。

 

主頁:http://dftree.wiki.sourceforge.net/home

下載:http://dftree.wiki.sourceforge.net/home

示例:http://dftree.wiki.sourceforge.net/Examples

CheckTree 

帶Checkbox的樹型jQuery插件。

 

主頁:http://static.geewax.org/checktree/index.html

下載:http://jquery-checktree.googlecode.com/

示例:http://static.geewax.org/checktree/index.html

 

 

JxLib

JxLib是一個基於Mootools開發的Web UI庫。類似於jQuery UI、Ext JS或Dijit。擁有豐富文檔和示例。提供的主要UI控件包括：

• layout managers
• buttons
• tabs
• toolbars
• dialogs
• panels
• trees
• grid control
  

   

  主頁:http://jxlib.org

  下載:http://jxlib.googlecode.com/files/jxlib-2.0-beta-6.zip

  示例:http://jxlib.org/reference/examples/about.html

   

   

  Mif.Tree 

  Mif.Tree是一個利用MooTools開發的樹形菜單控件。其代碼非常靈活，能夠讓你控制導航的每一部分如：添加新的節點；拖放節點；排序，定義顯示外觀等。Mif.Tree還支持通過鍵盤進行瀏覽，支持帶有checkbox控件的Tree menus。
  

   

   

  主頁:http://mifjs.net/tree/

  下載:http://mifjs.net/tree/

  示例:http://mifjs.net/tree/

  MooTools Tree-Component 

  支持Drag&Drop操作，采用Mootools開發的樹形控件。
  

   

  主頁:http://og5.net/christoph/article/MooTools_Tree_Component

  下載:http://og5.net/christoph/Scripts/Tree/tree.zip

  示例:http://og5.net/christoph/Scripts/Tree/

   

   

  JQTreeTable 

  JQTreeTable這個jQuery插件能夠將普通的HTML表格轉換成帶有嵌有Tree控件的表格。
  

   

   

  主頁:http://www.hanpau.com/index.php?page=jqtreetable

  下載:http://www.hanpau.com/extra/jqtreetable.zip

  示例:http://www.hanpau.com/index.php?page=jqtreetable

   

   

  jQuery Simple Tree 

  jQuery Simple Tree是一個可拖放的樹形控件。支持通過Ajax動態加載樹節點，具有簡單易於使用和漂亮的外觀等特點。
  

   

   

  主頁:http://news.kg/wp-content/uploads/tree/

  下載:http://news.kg/wp-content/uploads/tree/simpleTreeD&D.zip

  示例:http://news.kg/wp-content/uploads/tree/d&d/

   

   

  NotesForMenu

  NotesForMenu是一個非常簡單的jQuery插件用於創建多層級樹形菜單，只需一行代碼就能夠實現。
  

   

   

  主頁:http://www.notesfor.net/post/NotesForMenu.aspx

  下載:http://www.notesfor.net/JQuery/NotesForMenu/NotesForMenu.zip

  示例:http://www.notesfor.net/JQuery/NotesForMenu/R1.0/Default.htm

   

   

  wdTree  

   

  wdTree是一個輕量級jQuery插件用於展示帶有復選框的樹形控件。支持從數據庫懶加載節點，可以配置節點屬性。
  

   

  主頁:http://www.web-delicious.com/jquery-plugins/#tree

  下載:http://www.web-delicious.com/jquery-plugins-demo/wdTree.zip

  示例:http://www.web-delicious.com/jquery-plugins-demo/wdTree/huge-data-tree-sample.htm

   

  AdubyTree

  AdubyTree是一個帶有checkbox復選框的樹形jQuery插件。
   
• 支持XML和JSON兩種數據格式
• 支持本地數據和動態 AJAX遠程數據。
• 支持checkbox復選框，方便實際應用。
• 自帶basic、books、org、orguser、vista五套主題，用戶可以擴展定制主題。
  

   

  主頁:http://code.google.com/p/jquery-adubytree/

  下載:http://code.google.com/p/jquery-adubytree/downloads/list

  示例:http://code.google.com/p/jquery-adubytree/

   

   

  zTree 

  利用Jquery的核心代碼，實現一套能完成大部分常用工作的Tree功能
   
• 兼容 IE、FireFox、Chrome 等瀏覽器（對於IE 6.0的兼容問題將不做特殊維護）
• 在一個頁面內可同時生成多個 Tree 實例
• 支持 JSON 數據
• 支持一次性靜態生成 和 Ajax異步加載 兩種方式
• 支持多種事件響應及反饋
• 支持 Tree 的節點移動
• 支持任意更換皮膚（依靠css）
• 支持極其靈活的Checkbox選擇功能
• 個性化圖標
• 簡單的參數配置實現 靈活多變的功能 
  

   

  主頁:http://code.google.com/p/jquerytree/

  下載:http://code.google.com/p/jquerytree/downloads/list

  示例:http://code.google.com/p/jquerytree/

   

   

  Lightweight TreeList widget

  這是一個利用jQuery UI Widget Factory創建的輕量級，可換膚樹形列表控件。
  

   

   

  主頁:http://www.jordivila.net/lightweight-treelist-widget.html

  下載:http://www.jordivila.net/lightweight-treelist-widget.html

  示例:http://www.jordivila.net/code/js/jquery/ui-widgetTreeList/widgetTreeList.aspx

   

   

  jQuery LigerUI 

  簡介 LigerUI是基於jQuery開發的一系列控件組，包括表單、布局、表格等等常用UI控件 使用LigerUI可以快速創建風格統一的界面效果。
  

   

   

  主頁:http://code.google.com/p/ligerui/

  下載:http://code.google.com/p/ligerui/downloads/detail?name=LigerUI.Demos%2820110404%29.rar&can=2&q=

  示例:http://demo.ligerui.com/

   

   

  一個對JQuery Dynatree進行封裝的插件 - MagicDTree 

  MagicDTree是 JQuery 著名樹形插件Dynatree的包裝類，增加右鍵菜單，添加、刪除、更新接口。
  

   

   

  主頁:http://www.boarsoft.com/JavaScript/dtree

  下載:http://www.boarsoft.com/javascript/dtree

  示例:http://www.boarsoft.com/javascript/dtree

   

   

  JS樹狀菜單和表格控件 Tabletree4j 

  TableTree4J 是一個開源的基於javascript的樹狀菜單和表格控件，實用TableTree4J可以輕易實現帶樹狀折疊效果的表格和樹狀折疊菜單。

   

  支持以下功能：

  1.多種模式切換，樣式更改 
  2.cookies保存樹狀狀態 
  3.節點自定義排序 
  4.全瀏覽器支持 
  5.支持所有樹狀控件的基本功能 
  6.豐富的API文檔和多種展示例子，中英文語言選擇
  

   

  主頁:http://sourceforge.net/projects/tabletree4j/

  下載:http://sourceforge.net/projects/tabletree4j/

  示例:http://sourceforge.net/projects/tabletree4j/

   

   

  wdTree 

  wdTree是一個輕量級jQuery插件用於創建一個帶有嵌套Check Boxe的樹形控件。它擁有以下特性：

  • 父子節點選中
  • 從數據庫懶加樹節點
  • 可配置的節點屬性

  

   

  主頁:http://www.web-delicious.com/jquery-plugins-demo/wdTree/huge-data-tree-sample.htm

  下載:http://www.web-delicious.com/jquery-plugins-demo/wdTree/huge-data-tree-sample.htm

  示例:http://www.web-delicious.com/jquery-plugins-demo/wdTree/huge-data-tree-sample.htm