javascript 树控件 比较好用

1.ExtJS TreePanels


TreePanels 是ExtJS自身使用的树控件，它是目前最好用的树控件之一，它有诸多优点比如支持自由拖放，ExtJS本身就有非常完善的API和开发文档，但是商业项目是需要购买license的。


2.QooXdoo Tree Widget

QooXdoo Tree Widget是一款OOP风格的js树控件，它支持自由扩展树控件的样式，比如做成跟文件系统一样的风格，还支持动态添加子节点、键盘导航。

3.jsTree

jstree兼容多个浏览器，它有诸多跟extjs TreePanels一样的有点，不过由于是基于Jquery的插件，所以代码风格就不是OOP。

4.TreeView

TreeView 是基于Jquery的轻量性、可扩展性强的树控件，它可以把ul列表转变成可以折叠伸缩的树，支持基于配置存储和cookie的树结构保存策略，树控件的基础代码比较轻量很适合在集成到各种项目。

5.Destroydrop

跟4功能比较类似，风格更接近xp文件系统，构造起来非常方便。

6.jQuery File Tree

这是一款可配置的、ajax方式读取的Jquery文件浏览插件，大概用一行代码你就可以构造一颗树，它支持的服务端语言包括：PHP, ASP, ASP.NET, JSP, and Lasso，（它直接输出HTML，而jsTree和Extjs分别是通过json和xml来构建树）。

7.jQuery Simple Tree

jQuery SimpleTree是用来展示树形结构的可拖放插件，简介美观但是代码比较晦涩所以扩展可能比较难。

8.DHTML TreeView

又一个轻量级树控件。

9.Graphic JavaScript Tree with Layout

实现了J.Q.WalkerII（译者注：一种节点定位算法）一款js树控件。

10、Fly mini Tree 1.0 js 树控件
总结

构建树控件的比较理想的一种方法是用ul、li这种简单的标签组合来实现，但是你如果想实现复杂一点的比如要节点可编辑、可拖动、可更换风格等等我想ExtJS是最好的选择了。

赞 (0)

相关推荐

  • Bootstrap树形控件使用方法详解

    Bootstrap树形控件使用方法详解

    一.JQuery树形控件 Jquery树形控件是一款基于JQuery+bootstrap.完全通过js和样式手写出来的非常轻量级的控件,网上很多地方都能看到它的影子.它功能简单.用户体验不错.对于一些简单的层级关系展示比较实用,但对于节点的增删改实现起来就不容易了,如果非要做,可能需要自己去封装. 1.一睹初容 全部收起 展开一级 全部展开 2.代码示例 此控件实现起来也非常简单,只需要引用jQuery和bootstrap组件即可. <link href="~/Content/Tree1/

  • 选择TreeView控件的树状数据节点的JS方法(jquery)

    选择TreeView控件的树状数据节点的JS方法(jquery)

    方法要达到的效果是:" 改变一节点的选中状态时,其后代节点选中状态也要跟随当前节点的选中状态改变而改变.当前节点选中时,其所有祖先节点也要跟着选中;如取消时,要根据其同级节点是否有选中时,来决定其祖先节点的选中状态." 说明:树是用vs的TreeView控件生成的. 如图: 代码如下: 复制代码 代码如下: jQuery(function(){ jQuery(":checkbox").click(function(){ var objNode = this; var

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

    1.支持基于HTML定义.Json.XML方式加载树节点 2.支持拖放,动态增加.删除.重命名树节点 3.支持复选框 4.支持复制.剪切.粘贴树节点,动态刷新树 5.提供足够的回调方法: 6.此外,还提供了详细的使用文档 下载地址 :http://code.google.com/p/jstree/ 文档 :http://jstree.com/reference/_documentation/1_files.html 例子 :http://jstree.com/reference/_example

  • 基于jQuery的树控件实现代码(asp.net+json)

    基于jQuery的树控件实现代码(asp.net+json)

    语言: asp.net (其实都一样 只要服务器返回json就可以了); 先介绍下: 这个是一个美女大姐问我要的 写好了DEMO准备发给他 总不能独享 就贴出来了 第二次在cnblogs写博.. - - 那个代码有冗余 各位大虾可以自行修改... (失恋了 没心情弄); 压缩包: 里面有3个自己写的插件 1.一个是jQuery 请求webservices的便捷插件 2.一个防ext的mask()加载效果 3.树控件... 关于: /* 本代码只限交流学习使用,勿用于商业用途 系统难免存在bug

  • js树形控件脚本代码

    js树形控件脚本代码

    /*---------------------------------------------------------------------------*\ |  Subject: JavaScript Framework |  Author:  meizz |  Created: 2005-02-27 |  Version: 2006-08-11 |----------------------------------- |  MSN:huangfr@msn.com  QQ:112889082

  • javascript 树控件 比较好用

    javascript 树控件 比较好用

    1.ExtJS TreePanels TreePanels 是ExtJS自身使用的树控件,它是目前最好用的树控件之一,它有诸多优点比如支持自由拖放,ExtJS本身就有非常完善的API和开发文档,但是商业项目是需要购买license的. 2.QooXdoo Tree Widget QooXdoo Tree Widget是一款OOP风格的js树控件,它支持自由扩展树控件的样式,比如做成跟文件系统一样的风格,还支持动态添加子节点.键盘导航. 3.jsTree jstree兼容多个浏览器,它有诸多跟ex

  • Bootstrap 树控件使用经验分享(图文解说)

    Bootstrap 树控件使用经验分享(图文解说)

    jquery 树形控件 jquery 树形控件是一款基于jquery+bootstrap.完全通过js和样式手写出来的非常轻量级的控件,它功能简单.用户体验不错.对于一些简单的层级关系展示比较实用. 前言:很多时候我们在项目中需要用到树,有些树仅仅是展示层级关系,有些树是为了展示和编辑层级关系,还有些树是为了选中项然后其他地方调用选中项.不管怎么样,树控件都是很多项目里面不可或缺的组件之一.今天,博主打算结合自己的使用经历和网上找到的一些不错的树控件在这里做一个分享,希望能帮大家找到最合适的控件

  • 支持IE,Firefox的javascript 日历控件

    支持IE,Firefox的javascript 日历控件

    效果图:其实学习的方法,就是会搜索的方法,会搜索才能更快的解决问题.搜索方法: javascript 日历控件 site:jb51.net| 日期输入框演示-jb51.net script body{font-size:12px;font-family:Verdana,Arial,"宋体";} a:link {color:#464646;text-decoration:none;} a:visited {color:#464646;text-decoration:none;}ifram

  • Jquery zTree 树控件异步加载操作

    Jquery zTree 树控件异步加载操作

    zTree 是利用 JQuery 的核心代码,实现一套能完成大部分常用功能的 Tree 插件 兼容 IE.FireFox.Chrome 等浏览器 在一个页面内可同时生成多个 Tree 实例 支持 JSON 数据 支持一次性静态生成 和 Ajax 异步加载 两种方式 支持多种事件响应及反馈 支持 Tree 的节点移动.编辑.删除 支持任意更换皮肤 / 个性化图标(依靠css) 支持极其灵活的 checkbox 或 radio 选择功能 简单的参数配置实现 灵活多变的功能 异步加载的意思就是: 当点

  • 用javascript添加控件自定义属性解析

    前面说过为HTML元素添加自定义的属性,是通过手动在HTML控件中加上,其实可以在javascript中动态添加:如有一文本框: 复制代码 代码如下: <input type="text" id="txtInput" name="txtInput" value="自定义文本"> 如想增加idvalue属性(值为"自定义值"),可以在javascript中这样写: 复制代码 代码如下: var t

  • JavaScript在控件上添加倒计时功能的实现代码

    JavaScript在控件上添加倒计时功能的实现代码

    一.概述 在有些 报表 需求中,需要为控件添加倒计时功能,限制到某一个时间点后能进行一项操作或不能进行某项操作,比如查询,导出功能等等,又需要人性化地显示还有多少时间,即倒计时功能,比如下图中我们限制这个报表在每天10点后才能查询 当倒计时结束的时候,查询功能可用 这种功能如何实现的呢 二.实现思路 主要原理是利用控件的setEnable(true)/setEnable(false)来进行设置控件的可用与不可用状态,在获取时间的过程中,需要利用到JS中的获取时间,利用JS的定时器函数setInt

  • python图形界面开发之wxPython树控件使用方法详解

    python图形界面开发之wxPython树控件使用方法详解

    wxPython树控件介绍 树(tree)是一种通过层次结构展示信息的控件,如下图所示是树控件示例,左窗口中是树控件,在wxPython中树控件类是wx.TreeCtrl. wx.TreeCtrl常用的方法有 AddRoot(text, image=-1, selImage=-1, data=None).添加根节点,text参数根节点显示的文本:image参数是该节点未被选中时的图片索引,wx.TreeCtrl中使用的图片被放到wx.ImageList图像列表中:selImage参数是该节点被选

  • 用JavaScript隐藏控件的方法

    当style.display="block"或style.visibility="visible"时控件或见,当style.display = "none"或style.visibility = "hidden"时控件不可见.不同的是"display"不但隐藏控件,而且被隐藏的控件不再占用显示时占用的位置,而"visibility"隐藏的控件仅仅是将控件设置成不可见了,控件仍然占俱原来的

  • javascript利用控件对windows的操作实现原理与应用

    复制代码 代码如下: //windows 98 <script language=javascript> //var wsh = new ActiveXObject("WScript.Shell"); //wsh.Run("rundll32.exe user.exe,exitWindows"); </script> //win2000 or xp <script language=javascript> var wsh = new

随机推荐