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 实现的点击复制代码
Mar 24 Javascript
formvalidator验证插件中有关ajax验证问题
Jan 04 Javascript
jquery获取tr中控件值并操作tr实现思路
Mar 27 Javascript
详解JS 比较两个Json对象的值是否相等的实例
Nov 20 Javascript
js调试系列 初识控制台
Jun 18 Javascript
jquery ui bootstrap 实现自定义风格
Nov 14 Javascript
原生js获取iframe中dom元素--父子页面相互获取对方dom元素的方法
Aug 05 Javascript
详解Angular的双向数据绑定(MV-VM)
Dec 26 Javascript
javascript如何用递归写一个简单的树形结构示例
Sep 06 Javascript
Vue实现搜索结果高亮显示关键字
May 28 Javascript
vue点击自增和求和的实例代码
Nov 06 Javascript
jquery 插件重新绑定的处理方法分析
Nov 23 jQuery
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的switch判断语句的“高级”用法详解
2014/10/01 PHP
PHP保存session到memcache服务器的方法
2016/01/19 PHP
PHP将二维数组某一个字段相同的数组合并起来的方法
2016/02/26 PHP
JQuery1.6 使用方法三
2011/11/23 Javascript
extjs tabpanel限制选项卡数量实现思路及代码
2013/04/02 Javascript
JS在TextArea光标位置插入文字并实现移动光标到文字末尾
2013/06/21 Javascript
jQuery中Ajax的load方法详解
2015/01/14 Javascript
使用Chrome浏览器调试AngularJS应用的方法
2015/06/18 Javascript
JS实现的简洁二级导航菜单雏形效果
2015/10/13 Javascript
vue2.0获取自定义属性的值
2017/03/28 Javascript
vue项目中添加单元测试的方法
2018/07/21 Javascript
BootStrap table实现表格行拖拽效果
2018/12/01 Javascript
JavaScript this指向相关原理及实例解析
2020/07/10 Javascript
解决vue-pdf查看pdf文件及打印乱码的问题
2020/11/04 Javascript
Python中文件遍历的两种方法
2014/06/16 Python
Python用Pillow(PIL)进行简单的图像操作方法
2017/07/07 Python
Python迭代器和生成器定义与用法示例
2018/02/10 Python
如何使用 Pylint 来规范 Python 代码风格(来自IBM)
2018/04/06 Python
pandas数据筛选和csv操作的实现方法
2019/07/02 Python
Python实现的远程文件自动打包并下载功能示例
2019/07/12 Python
浅谈在django中使用filter()(即对QuerySet操作)时踩的坑
2020/03/31 Python
Jupyter notebook运行Spark+Scala教程
2020/04/10 Python
python 基于pygame实现俄罗斯方块
2021/03/02 Python
朗仕(Lab series)英国官网:雅诗兰黛集团男士专属护肤品牌
2017/11/28 全球购物
Java面试题:Java类的Main方法如果是Private将会怎么样
2016/08/18 面试题
vue 中 get / delete 传递数组参数方法
2021/03/23 Vue.js
会计师事务所审计实习自我鉴定
2013/09/20 职场文书
期末总结的个人自我评价
2013/11/02 职场文书
会计毕业生自我鉴定
2013/11/04 职场文书
药剂专业学生求职信范文
2013/12/28 职场文书
客服服务心得体会
2013/12/30 职场文书
协会周年庆活动方案
2014/08/26 职场文书
2014年教师节国旗下讲话稿
2014/09/10 职场文书
2014年工作总结与下年工作计划
2014/11/27 职场文书
有限责任公司股东合作协议书
2014/12/02 职场文书
大学生军训心得体会5篇
2019/08/15 职场文书