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 相关文章推荐
禁止刷新,回退的JS
Nov 25 Javascript
JavaScript 全面解析各种浏览器网页中的JS 执行顺序
Feb 17 Javascript
JQuery Tips(2) 关于$()包装集你不知道的
Dec 14 Javascript
Javascript new Date().valueOf()的作用与时间戳由来详解
Apr 24 Javascript
原生js做的手风琴效果的导航菜单
Nov 08 Javascript
javascript操作html控件实例(javascript添加html)
Dec 02 Javascript
js 高效去除数组重复元素示例代码
Dec 19 Javascript
javascript学习笔记之10个原生技巧
May 21 Javascript
jquery带动画效果幻灯片特效代码
Aug 27 Javascript
js实时获取窗口大小变化的实例代码
Nov 18 Javascript
Vue进度条progressbar组件功能
Apr 17 Javascript
node省市区三级数据性能测评实例分析
Nov 06 Javascript
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错误、异常处理机制(补充)
2012/05/07 PHP
PHP中实现接收多个name相同但Value不相同表单数据实例
2015/02/03 PHP
PHP连接MySQL进行增、删、改、查操作
2017/02/19 PHP
lnmp安装多版本PHP共存的方法详解
2018/08/02 PHP
PHP htmlspecialchars()函数用法与实例讲解
2019/03/08 PHP
PHP经典设计模式之依赖注入定义与用法详解
2019/05/21 PHP
PHP随机生成中文段落示例【测试网站内容时使用】
2020/04/26 PHP
ext jquery 简单比较
2010/04/07 Javascript
基于jQuery的一个扩展form序列化到json对象
2010/12/09 Javascript
javascript是怎么继承的介绍
2012/01/05 Javascript
js使浏览器窗口最大化实现代码(适用于IE)
2013/08/07 Javascript
页面加载完毕后滚动条自动滚动一定位置
2014/02/20 Javascript
jQuery写fadeTo示例代码
2014/02/21 Javascript
javascript数组操作总结和属性、方法介绍
2014/04/05 Javascript
jquery简单实现图片切换效果的方法
2015/05/12 Javascript
正则表达式替换html元素属性的方法
2016/11/26 Javascript
微信小程序实现登录页云层漂浮的动画效果
2017/05/05 Javascript
Angular.js中上传指令ng-upload的基本使用教程
2017/07/30 Javascript
AngularJS基于MVC的复杂操作实例讲解
2017/12/31 Javascript
javascript中的with语句学习笔记及用法
2020/02/17 Javascript
关于better-scroll插件的无法滑动bug(2021通过插件解决)
2021/03/01 Javascript
[03:48]显微镜下的DOTA2第四期——TP动作
2014/06/20 DOTA
python快排算法详解
2019/03/04 Python
Pandas之DataFrame对象的列和索引之间的转化
2019/06/25 Python
Python 实现一行输入多个数字(用空格隔开)
2020/04/29 Python
Python flask框架实现查询数据库并显示数据
2020/06/04 Python
纯CSS3实现的阴影效果
2014/12/24 HTML / CSS
Sneaker Studio乌克兰:购买运动鞋
2018/03/26 全球购物
软件测试笔试题
2012/10/25 面试题
学前教育学生自荐信范文
2013/12/31 职场文书
《孔繁森》教学反思
2014/04/17 职场文书
中学生教师节演讲稿
2014/09/03 职场文书
公司的门卫岗位职责
2014/09/09 职场文书
小学生2014国庆节演讲稿:祖国在我心中
2014/09/21 职场文书
中考百日冲刺决心书
2015/09/22 职场文书
2016年小学生教师节广播稿
2015/12/18 职场文书