多节点拖拽 ztree（treegrid和ztree的区别）

本文目录

• treegrid和ztree的区别
• 一个单独页面内如何实现两个zTree联动
• ztree获取选中节点时不能进入可视区域出现BUG如何解决_jquery
• zTree异步加载时添加子节点总是重复怎么解决
• 通过zTree自带的节点拖拽功能，如何获取移动节点ID和新的位置的节点ID
• ztree 的 字母z 是什么意思

treegrid和ztree的区别

treegrid和ztree的区别

个人觉得Ztree比较好用一些首先treeView是无序灵活的可摺叠的树形选单，只试用于一些选单的导航。Ztree就比较强大了；
灵活的（增/删/改/查）功能，可随意拖拽节点，还可以多节点拖拽哟
简单的引数配置实现 灵活多变的功能
在一个页面内可同时生成多个 Tree 例项
相容 IE、FireFox、Chrome、Opera、Safari 等浏览器
支援 JSON 资料
采用了 延迟载入 技术，上万节点轻松载入，即使在 IE6 下也能基本做到秒杀
支援任意更换面板 / 自定义图示（依靠css）
提供多种事件响应回拨
支援极其灵活的 checkbox 或 radio 选择功能《/ol》所以建议使用过程中，选择ztree比较好

jquery，ztree，core-3，5，js 和 jquery，ztree，core-3，5，min，js 的区别

一个是没有压缩的，一个是压缩过的程式码
你可以用记事本开启看看

ztree 中的jquery.js和最新版有什么区别

不清楚啊，如果要用ztree的话，把你使用的jquery库换成ztree的呗，这样能减少一些不必要的麻烦

jquery easyui datagrid 与 treegrid 有什么区别 现在上班的时候有时候用datagrid有时候用treegrid

dataGrid 就是普通的显示列表表格，TreeGrid 是树形表格，有父类和子类之分……

喜欢和爱的区别 讨厌和恨的区别？

喜欢代表有好感，这个人符合你的审美观，你有想靠近对方的想法，但这这种好感还没有太强烈；爱是喜欢的升级版，爱是两个人的事，相互之间都有着强烈的感情，互相离不开彼此，希望对方过得很好，已经成为生活中的一部分。讨厌是你不喜欢那个人，但是却没有报复和强烈的仇视想法；而恨不仅仅讨厌对方，还有一种想要报复和极度仇视的心理存在。

rapper和hip-hopper的区别?有区别吗

hip-hopper是rapper中一种

AFP和CFP的区别 4大明显区别

AFP，考试只考金融基础知识一，金融基础知识二
CFP，考的是个税，综合案例，投资，员工福利，保险，五科~~~
AFP是CFP认证体系之一，现如今在银行已经被列为基本持证之一，而CFP持证人，则是在现在，也是未来即将爆发的人才计划，无论跳槽，转岗，加薪，C 自然优于A
AFP通过培训学习，一个半月就考出，而CFP，在这里，零基础最快也要三个多月，~~~~

thought 和but，or和and的区别

你想写的应该是though吧though是尽管的意思，是副词，引导让步状语从句，可放句首或句中，但是不能和but连用but是但是的意思，是连词，连线两个并列句，中间用逗号隔开，表示转折；but也有除了的意思or是或者，连词，有选择的意思，通常否定句中连词用or，肯定句中连词用and，但是也有特殊情况在否定中并列结构用or 连线，但含有两个否定词的句子实际被看作是肯定结构，因此要用and。or还有否则的意思。and意思就不用我说了是连词，表并列的，可连线单词，从句

撙和盏的区别樽和盏的区别是什么

读音:
部首:木五笔:SUSF
释义:古代盛酒的器具。
读音:
部首:皿五笔:GLF
释义:1.小杯子。 2.指油灯盛油的浅盆。 3.量词，指灯。

chemistry和reactions的区别chemistry和reactions的区别是什么

从英语名称来理解，pharmaceutical chemistry 和 medicinal chemistry都是药物化学。但他们的方向却是不一样的。
现在国外药物化学已经分化成两门侧重点不同的专业课程：以发展新药为主要目标的药物化学(Medicinal Chemistry)和以临床应用、药学服务为主的药物化学(Pharmaceutical Chemistry)。
Medicinal Chemistry侧重发展研发新药，而Pharmaceutical Chemistry则是为药物提供载体材料，甚至医用缝合矫形辅助康复材料都应该属于这个范畴的。

一个单独页面内如何实现两个zTree联动

这次给大家带来一个单独页面内如何实现两个zTree联动，一个单独页面内实现两个zTree联动的注意事项有哪些，下面就是实战案例，一起来看一下。
简介
zTree 是利用 JQuery 的核心代码，实现一套能完成大部分常用功能的 Tree 插件
兼容 IE、FireFox、Chrome 等浏览器
在一个页面内可同时生成多个 Tree 实例支持 JSON 数据支持一次性静态生成 和 Ajax 异步加载 两种方式支持多种事件响应及反馈支持 Tree 的节点移动、、删除支持任意更换皮肤 / 个性化图标（依靠css）支持极其灵活的 checkbox 或 radio 选择功能简单的参数配置实现 灵活多变的功能
引言
今天开发的时候，因为需求需要实现同一个页面左右两棵树，如果选中某一棵树的某一个节点，相应的另一颗树的该节点也被选中。（两棵树是有关联的。当然可以根据自己需要改变联动条件和方式）。
此处不再粘贴实现树的代码，仅仅展示实现联动的方法。
代码：
function linkageTreeClick(event, treeId, treeNode) {
var param = treeNode.id; //获得点击树的ID
var otherTree = $.fn.zTree.getZTreeObj(treeId);
// 选取树的所有节点
var nodes = otherTree.getNodesByParam(param);
//遍历树的节点
for (var i in nodes) {
if(param==nodes.id){
otherTree.selectNode(nodes);
return;
}
}
}
其中treeId为你想与之联动的树的ID，将该方法在zTree的onclick方法中进行调用，根据自己情况，传入参数，然后实现联动。
方法selectNode()参数为树的节点，作用为：使该节点被选中。
相信看了本文案例你已经掌握了方法，更多精彩请关注Gxl网其它相关文章！
推荐阅读：
JS的class、构造函数、工厂函数使用方法
nodejs怎样调用微信分享功能

ztree获取选中节点时不能进入可视区域出现BUG如何解决_jquery

zTree 是一个依靠 jQuery 实现的多功能 “树插件”。优异的性能、灵活的配置、多种功能的组合是 zTree 最大优点。
zTree 的特点
● zTree v3.0 将核心代码按照功能进行了分割，不需要的代码可以不用加载
● 采用了延迟加载技术，上万节点轻松加载，即使在 IE6 下也能基本做到秒杀
● 兼容 IE、FireFox、Chrome、Opera、Safari 等浏览器
● 支持 JSON 数据
● 支持静态和 Ajax 异步加载节点数据
● 支持任意更换皮肤 / 自定义图标（依靠css）
● 支持极其灵活的 checkbox 或 radio 选择功能
● 提供多种事件响应回调
● 灵活的（增/删/改/查）功能，可随意拖拽节点，还可以多节点拖拽哟
● 在一个页面内可同时生成多个 Tree 实例
● 简单的参数配置实现 灵活多变的功能
zTree 的优势
zTree 的作者利用业余时间不断改进 zTree 功能，并且还能及时与用户沟通，及时回复各种疑问，便于新用户快速掌握。目前越来越多的用户都使用 zTree 替换了系统中原有的 树插件，这其中包括最近刚发布最新版本的QUI框架。
相关插件版本：
jquery.ztree.exedit-3.4.js
jquery.ztree.all-3.4.js
jquery-1.8.0.js
定位思路：
1、假设要定位节点A，该节点A的唯一标识是objid
2、根据objid从db中获取所有上级的objid，拼接并保存在ids变量。
3、在onAsyncSuccess方法中调用expandNodes，该方法中通过过滤，展开id在ids里的节点。
4、通常情况看下，在展开最后，依据objid通过【var node = zTree.getNodeByParam("id",id_);】获取节点A对象，然后通过【zTree.selectNode(node);】选择节点。
这种情况下，能够定位并选择目标节点，但是，当与该节点有同一父节点的数据较多时，节点A可能不会出现在可视区域内。查找源码，发现Ztree用的是【$("#" + node.tId).focus().blur();】方法实现定位。但很遗憾，有BUG。
于是，使用控制滚动条的方式自己控制定位。实现方式如下：
1、删除【zTree.selectNode(node);】，防止定位冲突
2、在onAsyncSuccess方法中，判定当节点展开完毕后，获取节点A的偏移量，并将值赋给树所在DIV的scrollTop属性。
$("#treeDiv1").animate({scrollTop:$("#"+devicesSelect.selectNodeId).offset().top-300},1000);//1000是ms,也可以用slow代替
注：devicesSelect.selectNodeId为节点A的节点tid，通过【me.selectNodeId = node.tId】获取；treeDiv1树所在div的id属性
3、取消之前选中节点：zTree.cancelSelectedNode();
4、为节点A增加被选中状态class：$("#" + devicesSelect.selectNodeId + "_a").addClass("curSelectedNode");
笔者淡淡的说：第2点我本来想用【$("#treeDiv1").scrollTop($("#"+devicesSelect.selectNodeId).offset().top-200);】这种方式的，虽然有效，但是同层节点过多时候，还是不能进入可视区域，我深深的怀疑是因为这个时候树还没展开，所以我就用了动画，无赖之举。
笔者最后的话：如果本文有任何错误，敬请看官火辣指出，不胜感激涕零。。

zTree异步加载时添加子节点总是重复怎么解决

这次给大家带来zTree异步加载时添加子节点总是重复怎么解决，解决zTree异步加载时添加子节点总是重复的注意事项有哪些，下面就是实战案例，一起来看一下。
zTree 是一个依靠 jQuery 实现的多功能 “树插件”。下面通过本文给大家分享jQuery zTree 异步加载添加子节点重复问题，需要的朋友参考下吧
zTree 简介
zTree 是一个依靠 jQuery 实现的多功能 “树插件”。优异的性能、灵活的配置、多种功能的组合是 zTree 最大优点。
zTree 是开源免费的软件（MIT 许可证）。如果您对 zTree 感兴趣或者愿意资助 zTree 继续发展下去，可以进行捐助。
zTree v3.0 将核心代码按照功能进行了分割，不需要的代码可以不用加载
采用了 延迟加载 技术，上万节点轻松加载，即使在 IE6 下也能基本做到秒杀
兼容 IE、FireFox、Chrome、Opera、Safari 等浏览器
支持 JSON 数据
支持静态 和 Ajax 异步加载节点数据
支持任意更换皮肤 / 自定义图标（依靠css）
支持极其灵活的 checkbox 或 radio 选择功能
提供多种事件响应回调
灵活的（增/删/改/查）功能，可随意拖拽节点，还可以多节点拖拽哟
在一个页面内可同时生成多个 Tree 实例
简单的参数配置实现 灵活多变的功能
原始问题
//添加结点, 产品和版本
function addNode(event) {
rMenu.css({ "visibility": "hidden" });
var treeNode = zTree.getSelectedNodes();
var pid;
var nodeName;
var treelevel;
if (!treeNode && event.target.tagName.toLowerCase() != "button" && $(event.target).parents("a").length == 0) {
//添加产品结点
pid = 0;
treeNode = null;
treelevel = 1;
} else if (treeNode) {
//添加版本结点
pid = treeNode.id;
treelevel = 2;
}
$.post(
"AddNode.action",
{ type: treelevel, id: pid },
function(nodeIdAndName) {
var params = /(+)/.exec(nodeIdAndName);
if (!((!treeNode && event.target.tagName.toLowerCase() != "button" && $(event.target).parents("a").length == 0) || treeNode.open)) {
zTree.expandNode(treeNode, true);
}
treeNode = zTree.addNodes(treeNode, { id: params, editable: "true", treelevel: treelevel });
});
}原本直接添加子节点的时候，如果父节点没有展开，会添加两个一样的子节点（第一次的时候）；后来我对父节点是否展开进行了判断，但是却变成了如果父节点展开，会添加两个一样的子节点（第一次的时候），这个问题要怎么解决呢？
办法一
将
if (!((!treeNode && event.target.tagName.toLowerCase() != "button" && $(event.target).parents("a").length == 0) || treeNode.open)) {
zTree.expandNode(treeNode, true);
}
treeNode = zTree.addNodes(treeNode, { id: params, editable: "true", treelevel: treelevel });改成
if(!treeNode && event.target.tagName.toLowerCase() != "button" && $(event.target).parents("a").length == 0)
{
treeNode = zTree.addNodes(treeNode, { id: params, editable: "true", treelevel: treelevel });
}
else if(treeNode.open)
{
if(treeNode.isParent)
{
zTree.reAsyncChildNodes(treeNode, "refresh");
}
else
{
treeNode.isParent=true;
zTree.reAsyncChildNodes(treeNode, "refresh");
}
}
else
{
zTree.expandNode(treeNode, true);
treeNode = zTree.addNodes(treeNode, { id: params, editable: "true", treelevel: treelevel });
}问题就可以解决了，但是有没有优化呢？感觉改后的代码分类太多了
最优办法
貌似不用这么麻烦吧？前两天回答了类似的问题。
1、点击添加子节点后，就直接 ajax 传给后台保存数据，捕获 success 事件
2、ajax success 时，利用 treeNode.zAsync 属性就可以知道此父节点是否进行过异步加载，如果为 false 那么直接 reAsyncChildNodes 刷新， 如果为 true 那么利用 addN...
if ((!treeNode && event.target.tagName.toLowerCase() != "button" && $(event.target).parents("a").length == 0) || treeNode.zAsync)
treeNode = zTree.addNodes(treeNode, { id: params, editable: "true", treelevel: treelevel });
else
zTree.reAsyncChildNodes(treeNode, "refresh");
相信看了本文案例你已经掌握了方法，更多精彩请关注Gxl网其它相关文章！
推荐阅读：
怎么发掘空白处隐藏元素
Ajax怎么实现下拉框无刷新联动
无new构建详解
jQuery实现下拉菜单导航

通过zTree自带的节点拖拽功能，如何获取移动节点ID和新的位置的节点ID

代码:

var setting = [{
callback : {
onDrop: onDrop
}
}]
function onDrop(event, treeId, treeNodes, targetNode, moveType){
var id = treeNodes.id;//获得被拖拽的节点id
var targetId = targetNode.id;//获得目标id
}

ztree 的 字母z 是什么意思

zTree
zTree 是一个依靠 jQuery 实现的多功能 “树插件”。优异的性能、灵活的配置、多种功能的组合是 zTree 最大优点。
软件名称
zTree
软件版本
v3.0
最新版本
v3.0
软件定义
开源免费的软件
优 点
优异的性能、灵活的配置
目录
1 zTree 介绍
2 zTree 的特点
3 zTree 的优势
zTree 介绍
zTree 是一个依靠 jQuery 实现的多功能 “树插件”。优异的性能、灵活的配置、多种功能的组合是 zTree 最大优点。专门适合项目开发，尤其是 树状菜单、树状数据的Web显示、权限管理等等。
zTree 是开源免费的软件（MIT 许可证）。在开源的作用下，zTree 越来越完善，目前已经拥有了不少粉丝，并且今后还会推出更多的 zTree 扩展功能库，让 zTree 更加强大。
zTree 的特点
● zTree v3.0 将核心代码按照功能进行了分割，不需要的代码可以不用加载
● 采用了延迟加载技术，上万节点轻松加载，即使在 IE6 下也能基本做到秒杀
● 兼容 IE、FireFox、Chrome、Opera、Safari 等浏览器
● 支持 JSON 数据
● 支持静态和 Ajax 异步加载节点数据
● 支持任意更换皮肤 / 自定义图标（依靠css）
● 支持极其灵活的 checkbox 或 radio 选择功能
● 提供多种事件响应回调
● 灵活的（增/删/改/查）功能，可随意拖拽节点，还可以多节点拖拽哟
● 在一个页面内可同时生成多个 Tree 实例
● 简单的参数配置实现 灵活多变的功能
zTree 的优势
zTree 的作者利用业余时间不断改进 zTree 功能，并且还能及时与用户沟通，及时回复各种疑问，便于新用户快速掌握。目前越来越多的用户都使用 zTree 替换了系统中原有的 树插件，这其中包括最近刚发布最新版本的QUI框架。
在线演示：
zTree in Google Code：
zTree in Github：
zTree in jQuery Plugins：
zTree Blog in iteye：
zTree Blog in oschina：
***隐藏网址***