JQuery写动态树示例代码


Posted in Javascript onJuly 31, 2013
// 业务类型树 
var settingOther = { 
edit: { 
enable: false 
}, 
// 异步加载树 
async: { 
enable: true, 
url:"initCoagencyTree.action", 
autoParam:["id", "name=n"], 
otherParam:{"otherParam":"zTreeAsyncTest"}, 
dataFilter: filter 
}, 
// 简单数据格式 
data: { 
simpleData: { 
enable: true 
} 
}, 
// 回调函数 
callback: { 
beforeClick: beforeClick, 
onClick: onClick 
} 
}; 
// 鼠标事件 
function beforeClick(treeId, treeNode, clickFlag) { 
// 普通选中 
if(clickFlag==1){ 
parent.document.getElementById("coagencyId").value=treeNode.id; 
parent.document.getElementById("parentId").value=treeNode.pId; 
parent.document.getElementById("name").value=treeNode.name; 
$("#coagencyId").attr("value",treeNode.id); 
$("#parentId").attr("value",treeNode.pId); 
}else{ 
// 取消选中 把值置空 
$("#coagencyId").attr("value",null); 
$("#parentId").attr("value",null); 
} 
return (treeNode.click != false); 
} 
// 鼠标解除节点的方法 
function onClick(event, treeId, treeNode, clickFlag) { 
// 默认执行的方法 显示节点的详细信息 
parent.showCoagencyDetail(); 
} 
// 异步加载需要是函数 
function filter(treeId, parentNode, childNodes) { 
if (!childNodes) return null; 
for (var i=0; i<childNodes.length; i++) { 
childNodes[i].name = childNodes[i].name.replace(/\.n/g, '.'); 
} 
return childNodes; 
} 
// 异步加载需要是函数 
function beforeAsync(treeId, treeNode) { 
return treeNode ? treeNode.level < 5 : true; 
} 
// 初始化树 
$(document).ready(function(){ 
$.fn.zTree.init($("#coagencyTree"),settingOther); 
}); 
</SCRIPT> 
<!-- 树节点id --> 
<s:hidden name="coagencyForm.coagencyId" id="coagencyId"/> 
<!-- 树节点 父id --> 
<s:hidden name="coagencyForm.parentId" id="parentId"/> 
<div class="zTreeDemoBackground left"> 
<ul id="coagencyTree" class="ztree" style="height: 640px"></ul> 
</div>
Javascript 相关文章推荐
javascript中方便增删改cookie的一个类
Oct 11 Javascript
JS函数重载的解决方案
May 13 Javascript
js运动动画的八个知识点
Mar 12 Javascript
javascript中clipboardData对象用法详解
May 13 Javascript
javascript运动详解
Jul 06 Javascript
js实现完美兼容各大浏览器的人民币大小写相互转换
Oct 29 Javascript
vue实现简单实时汇率计算功能
Jan 15 Javascript
Vue.js中的computed工作原理
Mar 22 Javascript
浅谈Angular单元测试总结
Mar 22 Javascript
vue中v-text / v-html使用实例代码详解
Apr 02 Javascript
vue实现修改图片后实时更新
Nov 14 Javascript
vue数据字典取键值项目的字典问题
Apr 12 Vue.js
HTML长文本截取含有HTML代码同样适用的两种方法
Jul 31 #Javascript
JS的千分位算法实现思路
Jul 31 #Javascript
一个JS的日期格式化算法示例
Jul 31 #Javascript
jquery实现div拖拽宽度示例代码
Jul 31 #Javascript
JS 获取浏览器和屏幕宽高等信息的实现思路及代码
Jul 31 #Javascript
javascript获取下拉列表框当中的文本值示例代码
Jul 31 #Javascript
禁用页面部分JavaScript方法的具体实现
Jul 31 #Javascript
You might like
php的curl封装类用法实例
2014/11/07 PHP
PHP使用NuSOAP调用Web服务的方法
2015/07/18 PHP
PHP设计模式之抽象工厂模式实例分析
2019/03/25 PHP
jquery 插件 任意位置浮动固定层
2008/12/25 Javascript
使用jQuery简化Ajax开发 Ajax开发入门
2009/10/14 Javascript
Extjs学习笔记之九 数据模型(上)
2010/01/11 Javascript
jquery 仿QQ校友的DIV模拟窗口效果源码
2010/03/24 Javascript
js实现页面跳转重定向的几种方式
2014/05/29 Javascript
javascript实现十六进制颜色值(HEX)和RGB格式相互转换
2014/06/20 Javascript
深入理解JavaScript系列(18):面向对象编程之ECMAScript实现
2015/03/05 Javascript
js中substr,substring,indexOf,lastIndexOf,split,replace的用法详解
2015/11/09 Javascript
javascript实现无缝上下滚动特效
2015/12/16 Javascript
angular十大常见问题
2017/03/07 Javascript
bootstrap table表格使用方法详解
2017/04/26 Javascript
提升页面加载速度的插件InstantClick
2017/09/12 Javascript
jquery实现搜索框功能实例详解
2018/07/23 jQuery
JavaScript插入排序算法原理与实现方法示例
2018/08/06 Javascript
element-ui 表格数据时间格式化的方法
2018/08/24 Javascript
详解vue通过NGINX部署在子目录或者二级目录实践
2018/09/03 Javascript
VUE实时监听元素距离顶部高度的操作
2020/07/29 Javascript
[01:10]DOTA2次级职业联赛 - EP战队宣传片
2014/12/01 DOTA
在Python中使用SQLite的简单教程
2015/04/29 Python
Python3使用正则表达式爬取内涵段子示例
2018/04/22 Python
浅析python中的迭代与迭代对象
2018/10/08 Python
Python3.8.2安装包及安装教程图文详解(附安装包)
2020/11/28 Python
澳大利亚儿童鞋在线:The Trybe
2019/07/16 全球购物
解释一下ArrayList Vector和LinkedList的实现和区别
2013/04/26 面试题
会计自我鉴定
2013/11/02 职场文书
最新党员思想汇报
2014/01/01 职场文书
先进员工获奖感言
2014/08/14 职场文书
大学生实训报告总结
2014/11/05 职场文书
小石潭记导游词
2015/02/03 职场文书
党支部鉴定意见
2015/06/02 职场文书
《分一些蚊子进来》读后感3篇
2020/01/09 职场文书
Python爬取英雄联盟MSI直播间弹幕并生成词云图
2021/06/01 Python
MySQL新手入门进阶语句汇总
2022/09/23 MySQL