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小类库获取浏览器的高度和宽度信息
Jan 15 Javascript
实现51Map地图接口(示例代码)
Nov 22 Javascript
jQuery中extend函数详解
Feb 13 Javascript
JavaScript必知必会(六) delete in instanceof
Jun 08 Javascript
JSON对象 详解及实例代码
Oct 18 Javascript
JavaScript面向对象分层思维全面解析
Nov 22 Javascript
JavaScript编写的网页小游戏,很给力
Aug 18 Javascript
浅谈JsonObject中的key-value数据解析排序问题
Dec 06 Javascript
基于vue展开收起动画的示例代码
Jul 05 Javascript
vue下使用nginx刷新页面404的问题解决
Aug 02 Javascript
判断JavaScript中的两个变量是否相等的操作符
Dec 21 Javascript
Vue的Eslint配置文件eslintrc.js说明与规则介绍
Feb 03 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运行环境配置的详解
2013/06/04 PHP
PHP转换文件夹下所有文件编码的实现代码
2013/06/06 PHP
浅谈PHP中foreach/in_array的使用
2015/11/02 PHP
PHP单态模式简单用法示例
2016/11/16 PHP
Laravel 类和接口注入相关的代码
2019/10/15 PHP
js function使用心得
2010/05/10 Javascript
浅谈JQ中mouseover和mouseenter的区别
2016/09/13 Javascript
js实时获取窗口大小变化的实例代码
2016/11/18 Javascript
JS排序之冒泡排序详解
2017/04/08 Javascript
JavaScript中常见的八个陷阱总结
2017/06/28 Javascript
JavaScript中三个等号和两个等号你了解多少
2017/07/04 Javascript
Angular实现下拉框模糊查询功能示例
2018/01/03 Javascript
jQuery中each和js中forEach的区别分析
2019/02/27 jQuery
JavaScript中遍历的十种方法总结
2020/12/15 Javascript
python登陆asp网站页面的实现代码
2015/01/14 Python
为Python的web框架编写MVC配置来使其运行的教程
2015/04/30 Python
详解Python核心编程中的浅拷贝与深拷贝
2018/01/07 Python
python for和else语句趣谈
2019/07/02 Python
python elasticsearch从创建索引到写入数据的全过程
2019/08/04 Python
解决python中显示图片的plt.imshow plt.show()内存泄漏问题
2020/04/24 Python
浅析Python面向对象编程
2020/07/10 Python
python 浮点数四舍五入需要注意的地方
2020/08/18 Python
HTML5 本地存储实现购物车功能
2017/09/07 HTML / CSS
三星美国官网:Samsung美国
2017/02/06 全球购物
表达自我的市场:Society6
2018/08/01 全球购物
总经理助理岗位职责
2013/11/08 职场文书
技术总监个人的自我评价范文
2013/12/18 职场文书
迟到早退检讨书
2014/02/10 职场文书
铲车司机岗位职责
2014/03/15 职场文书
优秀毕业生的求职信
2014/07/21 职场文书
党员对照检查材料
2014/09/22 职场文书
工作骂脏话检讨书
2014/10/05 职场文书
2016年植树节红领巾广播稿
2015/12/17 职场文书
深入理解margin塌陷和margin合并的解决方案
2021/06/26 HTML / CSS
Python 数据可视化之Matplotlib详解
2021/11/02 Python
【海涛解说】史上最给力比赛,挑战DOTA极限
2022/04/01 DOTA