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 相关文章推荐
静态的动态续篇之来点XML
Dec 23 Javascript
jQuery中与toggleClass等价的程序段 以及未来学习的方向
Mar 18 Javascript
js保存当前路径(cookies记录)
Dec 14 Javascript
JavaScript实现动态创建CSS样式规则方案
Sep 06 Javascript
javascript结合canvas实现图片旋转效果
May 03 Javascript
Javascript生成带参数的二维码示例
Oct 10 Javascript
jQuery图片轮播实现并封装(一)
Dec 03 Javascript
解决Angular.Js与Django标签冲突的方案
Dec 20 Javascript
Bootstrap select下拉联动(jQuery cxselect)
Jan 04 Javascript
Angular 输入框实现自定义验证功能
Feb 19 Javascript
详解JavaScript实现动态的轮播图效果
Apr 29 Javascript
jQuery实现的鼠标拖动画矩形框示例【可兼容IE8】
May 17 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中的时间处理
2006/10/09 PHP
聊天室php&amp;mysql(六)
2006/10/09 PHP
php htmlspecialchars()与shtmlspecialchars()函数的深入分析
2013/06/05 PHP
使用php实现截取指定长度
2013/08/06 PHP
PHP OPP机制和模式简介(抽象类、接口和契约式编程)
2014/06/09 PHP
ThinkPHP模板中判断volist循环的最后一条记录的验证方法
2014/07/01 PHP
详解php比较操作符的安全问题
2015/12/03 PHP
PHP7标量类型declare用法实例分析
2016/09/26 PHP
jQuery 遍历json数组的实现代码
2020/09/22 Javascript
Ext中下拉列表ComboBox组件store数据格式用法介绍
2013/07/15 Javascript
jquery form 隐藏的input 选择
2014/04/29 Javascript
JavaScript中Cookie操作实例
2015/01/09 Javascript
jquery渐隐渐显的图片幻灯闪烁切换实现方法
2015/02/26 Javascript
常用的JavaScript WEB操作方法分享
2015/02/28 Javascript
Javascript中this关键字的一些小知识
2015/03/15 Javascript
基于HTML5上使用iScroll实现下拉刷新,上拉加载更多
2016/05/21 Javascript
客户端验证用户名和密码的方法详解
2016/06/16 Javascript
浅谈jQuery为哪般去掉了浏览器检测
2016/08/29 Javascript
JS实现的验证身份证及获取地区功能示例
2017/01/16 Javascript
jQuery分页插件jquery.pagination.js使用方法解析
2017/02/09 Javascript
基于jQuery封装的分页组件
2017/06/26 jQuery
微信小程序动态添加和删除组件的现实
2020/02/28 Javascript
[03:24]2014DOTA2国际邀请赛 神秘商店生意火爆
2014/07/18 DOTA
Python中的Numpy入门教程
2014/04/26 Python
Python中psutil的介绍与用法
2019/05/02 Python
python实现把两个二维array叠加成三维array示例
2019/11/29 Python
Tensorflow实现部分参数梯度更新操作
2020/01/23 Python
Python直接赋值及深浅拷贝原理详解
2020/09/05 Python
Django用户认证系统如何实现自定义
2020/11/12 Python
发现两个有趣的CSS3动画效果
2013/08/14 HTML / CSS
HTML5的自定义属性data-*详细介绍和JS操作实例
2014/04/10 HTML / CSS
For Art’s Sake官网:手工制作的奢华眼镜
2018/12/15 全球购物
教育专业毕业生推荐信
2014/07/10 职场文书
初中学生操行评语
2014/12/26 职场文书
幼儿教师师德师风自我评价
2015/03/05 职场文书
管理者日常工作必备:22条企业管理流程模板!
2019/07/12 职场文书