`
zTreeAPI
  • 浏览: 346391 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

JQuery Tree插件——zTree v3.0 正式版 发布

阅读更多

    在大家的帮助 和 关注下,今天 zTree v3.0 正式版 可以发布了。 v3.0 正式版在功能、性能方便比 v2.x 版本都有了很多改善,尤其是性能方面。用过 v3.0 beta 版本的朋友应该已经体验到了。

 


    但还要再提提醒大家,v3.0 在代码架构上的改动较大,所以升级 v2.x 版本的 zTree 必须要配合修改代码,不能仅仅升级 js 文件。 对于没有使用过 v3.0 beta 的朋友,升级前请先浏览 v2.6 与 v3.0 的对照说明:http://www.baby666.cn/v3/faq.php#_101 


    另外,为了便于让 zTree 走出国门,这次还将 网站、Demo、API文档等都做成了 中文、英文两套。可惜本人英文水平有限,里面会有很多错误,希望大家多多包涵,同时也恳请英文好的朋友多帮我找找错误,并且通知我,谢谢!


    由于时间关系,再加上我觉得目前 API文档 还不够完善(尤其是英语方面),所以尚未制作 离线版本,参考 API文档还请继续在线浏览吧:http://www.baby666.cn/v3/api.php 


    在线操作演示:http://www.baby666.cn/v3/demo.php#_101


    快速下载地址:http://code.google.com/p/jquerytree/downloads/list


    请特别注意,v2.x 中的 treeNode.nodes 和 v3.0 beta 中的 treeNode.childs 已经被修改为 treeNode.children


    下面把 v3.0 beta 和 正式版两次的修改记录都公布一下,便于大家了解:

 

    v3.0 beta 修改内容:

   * 【修改】zTree 的 js 代码架构全面修改,并且拆分 

   * 【修改】zTree 的 css 样式全面修改,对浏览器可以更好地兼容,同时解决了以前1个像素差的问题 

   * 【优化】采用延迟加载技术,一次性加载大数据量的节点性能飞速提升 

   * 【增加】支持多节点同时选中、拖拽 

   * 【增加】checkNode、checkAllNodes 等多种方法 

   * 【增加】IE6 自动取消动画展开、折叠的功能 

   * 【修正】异步加载 & 编辑模式 能够更完美的共存 

   * 【修正】setting 配置更加合理,并且增加了若干项配置参数 

   * 【修正】treeNode 节点数据的属性更加合理,并且增加了一些方法 

   * 【修正】拖拽操作更加灵活方便,更容易制定自己的规则

 

    v3.0 正式版 修改内容:

   * 【增加】setting.check.autoCheckTrigger 默认值 false,可以设置联动选中时是否触发事件回调函数

   * 【增加】setting.callback.beforeEditName 回调函数,以保证用户可以捕获点击编辑按钮的事件

   * 【增加】treeNode.chkDisabled 属性,显示 checkbox 但是用户无法修改 checkbox 状态,并且该 checkbox 会影响父节点的 checkbox 的半选状态

   * 【增加】setting.check.nocheckInherit 属性,用户设置子节点继承 nocheck 属性,用于批量初始化节点,不适用于已经显示的节点

   * 【增加】setting.edit.drag.autoExpandTrigger 默认值 false,可以设置自动展开、折叠操作时是否触发事件回调函数

   * 【增加】setting.view.nameIsHTML 默认值 false,允许用户对 name 设置 DOM 对象

   * 【增加】treeNode.click 属性的说明文档

   * 【增加】treeObj.setChkDisabled 方法用于设置 checkbox / radio disabled 状态

   * 【增加】treeNode.halfCheck 属性,用于强制设定节点的半选状态

 

   * 【修改】异步加载 & 编辑功能 共存时,拖拽节点 或 增加节点 导致 ie 上报错的 bug (apply 方法引起)

   * 【修改】zTreeStyle 样式冲突

   * 【修改】setting.data.key.title 默认值设置为 "",初始化时自动赋值为 setting.data.key.name 这样可避免希望 title 与 name 一致的用户反复设置参数

   * 【修改】点击叶子节点的连接线会触发 expand 事件的 bug

   * 【修改】IE 下 点击叶子节点连线会出现虚线框的 bug

   * 【修改】updateNode 导致 checkbox 半选状态错误的 bug

   * 【修改】checkNode 方法实现 toggle 操作, 取消 expandAll 方法的 toggle 操作

   * 【修改】zTree 内鼠标移动会抢页面上 input 内的焦点的 bug

   * 【修改】beforeRename / onRename 的触发方式——即使名称内容未改变也会触发,便于用户配合 beforeEditName 捕获编辑状态的结束,赋予用户更多调整规则的权利

   * 【修改】与 easyUI 共存时无法拖拽的bug

   * 【修改】beforeRename 在 Firefox 下如果利用 alert,会触发两次的 bug

   * 【修改】checkNode/expandNode/removeNode 方法,默认不触发回调函数,恢复 v2.6 的默认状态,同时增加 callbackFlag 参数,设置为 true 时,可以触发回调函数

   * 【修改】IE9下“根据参数查找节点”的Demo 报错:行14 重新声明常量属性(Demo 自身的问题,定义了history变量)

   * 【修改】初始化 zTree 时 onNodeCreated 事件回调函数中无法 用 getZTreeObj 获取 zTree 对象的 bug

   * 【修改】setting.edit.drag.prev / next / inner 参数,增加被拖拽的节点集合

   * 【修改】异步加载模式下,otherParam 使用Array数组会出错的 bug。例如: ["id", "1", "name", "test"]

   * 【修改】FireFox 下多棵树拖拽异常的 bug

   * 【修改】exedit 中调用 excheck库的方法时没有进行容错处理,导致如果只加入 exedit 而没有 excheck的时候,会出现 js 错误

   * 【修改】显示 checkbox 的 zTree 在编辑模式下,移动节点不会更新父节点半选状态的 bug

   * 【修改】treeNode.childs --> children; treeObject.removeChilds --> removeChildNodes; setting.data.key.childs --> children(英文不好惹的祸!抱歉了!)

   * 【修改】onRemove 回调中得到的 treeNode 还可以查找 preNode、nextNode 的bug。 修正后,getPreNode 和 getNextNode 都返回 null; 为了便于查找父节点,getParentNode 仍保留

   * 【修改】简单数据模式下,如果 id 与 pId 的值相同会导致该节点无法正常加载的 bug

   * 【修改】移动或删除中间节点会导致最后一个节点连接线图标变小的 bug

 

 

分享到:
评论
30 楼 zTreeAPI 2012-05-04  
whxia320 写道
zTree挺多的,但是功能越多越臃肿,其实有时候我们只用到其中一个,不知道每个功能能否定制呢?

没错儿,越多越臃肿,所以 v3 版本中做了拆分 分为 core、exedit、excheck 你可以进行组合。 最近本的使用core即可。不知道你还需要定制哪些内容?
29 楼 whxia320 2012-05-04  
zTree挺多的,但是功能越多越臃肿,其实有时候我们只用到其中一个,不知道每个功能能否定制呢?
28 楼 zTreeAPI 2012-02-13  
youtops 写道
zTree这个插件真的非常好,希望这个插件越来越好!
Demo 带 checkbox 的多选下拉菜单 -- zTree
http://www.baby666.cn/v3/demo.php#_509

这个实例中选择加上如下的方式会不会更方便?
1,选择大类后自动选择小类会更方便;
2,shift按键结合选择

感谢支持, 你的建议很好,只不过 目前 Demo 以简单为主,再加上时间问题,恐怕目前还不回增加你提的内容,不过我会记录下来,有机会制作高级应用的Demo。
27 楼 youtops 2012-02-12  
zTree这个插件真的非常好,希望这个插件越来越好!
Demo 带 checkbox 的多选下拉菜单 -- zTree
http://www.baby666.cn/v3/demo.php#_509

这个实例中选择加上如下的方式会不会更方便?
1,选择大类后自动选择小类会更方便;
2,shift按键结合选择
26 楼 lqixv 2012-02-11  
zTreeAPI 写道
lqixv 写道
zTreeAPI 写道
lqixv 写道
你好。我有个问题请指教。

我的一个节点的内容,本身就是一个 json 对象。例如这样的节点:
{ id:234, pId:23, name:{'cn':'中文','en':'english'}}

在页面开始的地方,我定义了一个变量,保存了我想取的属性,比如,theName = 'cn',我想在显示这颗树时,可以根据这个变量来显示对应的内容。

比如,如果 theName = 'cn',我希望对应树的节点显示“中文”,如果 theName='en',我希望树节点能显示 “english”。

这个怎么做?希望能得到指点,谢谢!

不好意思,对于name不支持何种嵌套的属性获取。 不知道你的数据是如何生成的,如果你能直接生成这样的格式: { id:234, pId:23, 'cn':'中文','en':'english'} 就 so easy了。


谢谢回复。
我的本意是,在多语言的环境下,如果用户浏览的是英文版本,我希望我的树出来的是英文,中文环境是中文。因此,我有个字段用 json 格式保存了多种语言环境的 内容。就出现了我前台提的问题。如果生成你说的格式,是没问题的。但我通过什么办法,让这颗树显示的内容是 en 对应的值呢(在英文环境)

你对应英文版和中文版做两套 setting 就是了呀,或者 设置 setting.data.key.name 的对象用某个环境变量,英文版时就设置为en、中文版时就设置为cn即可

只能说一句,太感谢了 
25 楼 sisimoon 2012-02-10  
zTreeAPI 写道
sisimoon 写道
说错了,是jQuery easyui 和 ztree 结合使用

呵呵,不能说回复的太快了,只能说你的运气好,碰巧我上来看到了消息。 你和 easyUI 一起使用没有发现冲突,也要感谢在 v3.0 之前就是用 zTree 的朋友呀,没有他们提出的建议和发现的 bug,你肯定不会用的这么爽


=========================
是啊,前人栽树后人乘凉。easyui的 tree 有些单调,而dhtmlx的tree又比较臃肿,zTree也是基于jQuery,跟easyui一起用再合适不过了。
24 楼 zTreeAPI 2012-02-10  
sisimoon 写道
说错了,是jQuery easyui 和 ztree 结合使用

呵呵,不能说回复的太快了,只能说你的运气好,碰巧我上来看到了消息。 你和 easyUI 一起使用没有发现冲突,也要感谢在 v3.0 之前就是用 zTree 的朋友呀,没有他们提出的建议和发现的 bug,你肯定不会用的这么爽
23 楼 sisimoon 2012-02-10  
说错了,是jQuery easyui 和 ztree 结合使用
22 楼 sisimoon 2012-02-10  
zTreeAPI 写道
sisimoon 写道
你好博主:问个问题,如果设置动态设置某个节点的名称?
比如我调用了另外一个页面B更新了某个节点的一些属性,当我关闭B页面的时候要用脚本把tree上面对应的node名称改掉,如何实现?
我不想刷新整个树,太耗资源了。

利用 getNodeByParam 方法可以找到你需要操作的节点数据,然后直接修改treeNode.name,修改后利用 updateNode 方法更新即可!

我靠,你回复的也太快了吧!!!!!
真是太赞了,我这阵子一直把jQuery和zTree3.0结合使用,到目前位置没有遇到冲突,再赞一个。
21 楼 zTreeAPI 2012-02-10  
sisimoon 写道
你好博主:问个问题,如果设置动态设置某个节点的名称?
比如我调用了另外一个页面B更新了某个节点的一些属性,当我关闭B页面的时候要用脚本把tree上面对应的node名称改掉,如何实现?
我不想刷新整个树,太耗资源了。

利用 getNodeByParam 方法可以找到你需要操作的节点数据,然后直接修改treeNode.name,修改后利用 updateNode 方法更新即可!
20 楼 sisimoon 2012-02-10  
你好博主:问个问题,如果设置动态设置某个节点的名称?
比如我调用了另外一个页面B更新了某个节点的一些属性,当我关闭B页面的时候要用脚本把tree上面对应的node名称改掉,如何实现?
我不想刷新整个树,太耗资源了。
19 楼 zTreeAPI 2012-02-10  
lqixv 写道
zTreeAPI 写道
lqixv 写道
你好。我有个问题请指教。

我的一个节点的内容,本身就是一个 json 对象。例如这样的节点:
{ id:234, pId:23, name:{'cn':'中文','en':'english'}}

在页面开始的地方,我定义了一个变量,保存了我想取的属性,比如,theName = 'cn',我想在显示这颗树时,可以根据这个变量来显示对应的内容。

比如,如果 theName = 'cn',我希望对应树的节点显示“中文”,如果 theName='en',我希望树节点能显示 “english”。

这个怎么做?希望能得到指点,谢谢!

不好意思,对于name不支持何种嵌套的属性获取。 不知道你的数据是如何生成的,如果你能直接生成这样的格式: { id:234, pId:23, 'cn':'中文','en':'english'} 就 so easy了。


谢谢回复。
我的本意是,在多语言的环境下,如果用户浏览的是英文版本,我希望我的树出来的是英文,中文环境是中文。因此,我有个字段用 json 格式保存了多种语言环境的 内容。就出现了我前台提的问题。如果生成你说的格式,是没问题的。但我通过什么办法,让这颗树显示的内容是 en 对应的值呢(在英文环境)

你对应英文版和中文版做两套 setting 就是了呀,或者 设置 setting.data.key.name 的对象用某个环境变量,英文版时就设置为en、中文版时就设置为cn即可
18 楼 lqixv 2012-02-09  
zTreeAPI 写道
senton 写道
哥们,你的英语比较差啊,children竟然取名为childs

如果你英文不错,希望你能多看看英文版。。帮我挑挑错误吧,谢谢了!

17 楼 lqixv 2012-02-09  
zTreeAPI 写道
lqixv 写道
你好。我有个问题请指教。

我的一个节点的内容,本身就是一个 json 对象。例如这样的节点:
{ id:234, pId:23, name:{'cn':'中文','en':'english'}}

在页面开始的地方,我定义了一个变量,保存了我想取的属性,比如,theName = 'cn',我想在显示这颗树时,可以根据这个变量来显示对应的内容。

比如,如果 theName = 'cn',我希望对应树的节点显示“中文”,如果 theName='en',我希望树节点能显示 “english”。

这个怎么做?希望能得到指点,谢谢!

不好意思,对于name不支持何种嵌套的属性获取。 不知道你的数据是如何生成的,如果你能直接生成这样的格式: { id:234, pId:23, 'cn':'中文','en':'english'} 就 so easy了。


谢谢回复。
我的本意是,在多语言的环境下,如果用户浏览的是英文版本,我希望我的树出来的是英文,中文环境是中文。因此,我有个字段用 json 格式保存了多种语言环境的 内容。就出现了我前台提的问题。如果生成你说的格式,是没问题的。但我通过什么办法,让这颗树显示的内容是 en 对应的值呢(在英文环境)
16 楼 zTreeAPI 2012-02-08  
huangsky 写道
你好,ztree中删除和修改功能能否重写事件,例如我不想编辑的时候树的节点变成一个文本框(有时候节点名称稍微长点,变成文本框影响美观),我可以在我自己设定的控件里显示节点名称,然后修改了后,提交了再去改变节点的名称。

当然可以了, 请看 beforeRemove 和 beforeEditName 两个 callback,你只需要 在这两个 callback 里面 return false 同时触发自己的方法就是了。 修改后在自己的方法里面利用 removeNode 和 updateNode 方法就可以了。
15 楼 huangsky 2012-02-08  
你好,ztree中删除和修改功能能否重写事件,例如我不想编辑的时候树的节点变成一个文本框(有时候节点名称稍微长点,变成文本框影响美观),我可以在我自己设定的控件里显示节点名称,然后修改了后,提交了再去改变节点的名称。
14 楼 zTreeAPI 2012-02-08  
huangsky 写道
你好,ztree的节点的增删改的按钮,一设置就是整颗树都套用同套模式了,能否做到自由控制节点的增删改按钮。例如A节点我只想要增加按钮,B节点我要删除按钮。

增 按钮 不说了吧,这个没有默认的,有也是你自己利用添加自定义控件制作的,所以完全可以自行控制。 我来给你说说 删、改 这两个按钮——请看 API 中 showRemoveBtn 和 showRenameBtn 这两个说明,他们可以设定为 Function, 利用 Function 完全可以实现你的需求。
13 楼 zTreeAPI 2012-02-08  
senton 写道
哥们,你的英语比较差啊,children竟然取名为childs

如果你英文不错,希望你能多看看英文版。。帮我挑挑错误吧,谢谢了!
12 楼 zTreeAPI 2012-02-08  
senton 写道
哥们,你的英语比较差啊,children竟然取名为childs

献丑了!这个“比较”估计还算是抬举了
11 楼 huangsky 2012-02-08  
你好,ztree的节点的增删改的按钮,一设置就是整颗树都套用同套模式了,能否做到自由控制节点的增删改按钮。例如A节点我只想要增加按钮,B节点我要删除按钮。

相关推荐

    JQuery zTree v3.0

    zTree v3.0 正式版在功能、性能方便比 v2.x 版本都有了很多改善,尤其是性能方面。 但还要再提提醒大家,v3.0 在代码架构上的改动较大,所以升级 v2.x 版本的 zTree 必须要配合修改代码,不能仅仅升级 js 文件。

    JQuery zTree v3.0 下载

    zTree 是利用 JQuery 的核心代码,实现一套能完成大部分常用功能的 Tree 插件。它与 IE、FireFox、Chrome 等浏览器保持兼容,在一个页面内可同时生成多个Tree 实例,支持一次性静态生成和Ajax 异步加载两种方式,...

    JQuery zTree v3.2 最新版

    zTree v3.0 将核心代码按照功能进行了分割,不需要的代码可以不用加载 采用了 延迟加载 技术,上万节点轻松加载,即使在 IE6 下也能基本做到秒杀 兼容 IE、FireFox、Chrome、Opera、Safari 等浏览器 支持 JSON 数据 ...

    JQuery zTree v3.4 ztree

    JQuery zTree 是一个基于 jQuery 的插件,用于在网页中构建交互式的树形结构。v3.4 版本是其稳定且功能丰富的版本之一,适用于多种应用场景,如数据展示、导航菜单、文件目录等。它以其易用性、高效性和强大的功能...

    JQuery zTree v3.3

    JQuery zTree是一款基于JavaScript的开源树...总之,JQuery zTree v3.3是一个强大且易用的JavaScript树形插件,它通过提供多种操作功能、良好的性能以及灵活的定制选项,满足了开发者在构建网页树形结构时的各种需求。

    JQuery-zTree-v2.6.rar_Java 8_jquery tree_jquery-ztree-2.6.js_jqu

    2、在一个页面内可同时生成多个 Tree 实例 3、支持 JSON 数据 4、支持一次性静态生成 和 Ajax 异步加载 两种方式 5、支持多种事件响应及反馈 6、支持 Tree 的节点移动、编辑、删除 7、支持极其灵活的 checkbox...

    zTree 3.0 实例下载

    **zTree 3.0 实例详解** zTree是一款基于JavaScript的树形插件,广泛应用于网页中的数据展示,如文件目录、组织架构等场景...因此,下载并深入研究zTree 3.0的实例对于任何想要使用此插件的开发者来说都是至关重要的。

    全网jquery.tree树形菜单打包下载(zTree&jquery-ui&treeview共四种)

    这个压缩包包含四个不同的jQuery树形插件:zTree、jQuery UI Treeview、jQuery UI Draggable Tree和jQuery Simple Treeview。这些插件各有特色,适用于不同的项目需求。 首先,zTree是一款功能强大的jQuery插件,...

    jQuery 树形结构插件 zTree

    **jQuery zTree 插件详解** zTree 是一个基于 jQuery 的强大树形控件,它在Web开发中被广泛应用于构建动态的、交互式的树形结构。zTree 的设计目标是提供高性能、易于配置和丰富的功能,使得开发者可以轻松地在网页...

    Jquery-ztree树形菜单代码并适应移动端

    JQuery-zTree是一款基于jQuery的树形插件,它提供了丰富的功能和良好的性能,尤其适用于构建树形结构的菜单和数据展示。在移动端应用中,zTree能够自适应屏幕尺寸,提供良好的用户体验。本项目提供的代码是针对...

    JQuery zTree v2.6

    JQuery zTree是一款基于JavaScript的树形插件,其v2.6版本在功能和性能上进行了优化,为开发者提供了更强大的树形结构处理能力。这个版本的zTree不仅包含了完整的API文档,还附带了一系列经典实例,便于开发者理解和...

    archive_zTree(JQuery Tree) v3.1.zip.zip

    【标题】"archive_zTree(JQuery Tree) v3.1.zip.zip" 提供的是一个用于构建树形结构的jQuery插件——zTree的v3.1版本。zTree是一款广泛应用于网页开发中的JavaScript库,它使得在网页上展示层级关系的数据变得更加...

    JQuery实现树插件 Ztree

    JQuery实现树插件Ztree是一个广泛使用的轻量级前端组件,它为Web开发者提供了构建交互式树形结构的便捷工具。Ztree基于流行的JavaScript库JQuery,因此,如果你已经熟悉JQuery,那么掌握Ztree将相对容易。在本文中,...

    JQuery zTree v3.5 api

    jQuery zTree 是一款基于 jQuery 的树形插件,广泛应用于网站导航、组织结构展示、文件目录管理等多种场景。v3.5 版本是其一个重要的里程碑,它提供了丰富的功能和优化的性能,使得开发者能够更加灵活地构建树形结构...

    JQuery zTree v3.5.47.zip

    《JQuery zTree v3.5.47:构建动态树形菜单的利器》 JQuery zTree是一款基于JavaScript的开源库,专用于构建交互式的树形菜单。在这个版本v3.5.47中,它继续提供高效、灵活且功能丰富的解决方案,尤其适用于网页中...

    jquery.zTree.js.rar

    jquery-1.4.4.min.js jquery.ztree.exhide.min.js jquery.ztree.exedit.min.js jquery.ztree.excheck.min.js jquery.ztree.core.min.js jquery.ztree.all.min.js jquery-1.4.4.js jquery.ztree.exhide.js jquery....

    JQueryTree zTree

    `JQueryTree` 和 `zTree` 是两个基于JavaScript库,尤其是jQuery框架的插件,用于实现动态、交互式的树形组件。 **JQueryTree** `JQueryTree` 是一个轻量级的jQuery插件,主要用于构建可操作的HTML5树视图。它提供...

    JQuery zTree v3.5.14

    **jQuery zTree v3.5.14** 是一个基于jQuery的树形插件,它在Web开发中广泛用于创建交互式的树形结构。这个版本3.5.14是zTree的一个稳定版本,提供了丰富的功能和优化的性能。下面我们将深入探讨zTree的核心特性、...

Global site tag (gtag.js) - Google Analytics