JQuery寫動(dòng)態(tài)樹(shù)示例代碼
更新時(shí)間:2013年07月31日 18:08:29 作者:
本文為大家介紹下使用JQuery寫的動(dòng)態(tài)樹(shù),具體實(shí)現(xiàn)如下,感興趣的朋友可以學(xué)習(xí)下
復(fù)制代碼 代碼如下:
// 業(yè)務(wù)類型樹(shù)
var settingOther = {
edit: {
enable: false
},
// 異步加載樹(shù)
async: {
enable: true,
url:"initCoagencyTree.action",
autoParam:["id", "name=n"],
otherParam:{"otherParam":"zTreeAsyncTest"},
dataFilter: filter
},
// 簡(jiǎn)單數(shù)據(jù)格式
data: {
simpleData: {
enable: true
}
},
// 回調(diào)函數(shù)
callback: {
beforeClick: beforeClick,
onClick: onClick
}
};
// 鼠標(biāo)事件
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);
}
// 鼠標(biāo)解除節(jié)點(diǎn)的方法
function onClick(event, treeId, treeNode, clickFlag) {
// 默認(rèn)執(zhí)行的方法 顯示節(jié)點(diǎn)的詳細(xì)信息
parent.showCoagencyDetail();
}
// 異步加載需要是函數(shù)
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;
}
// 異步加載需要是函數(shù)
function beforeAsync(treeId, treeNode) {
return treeNode ? treeNode.level < 5 : true;
}
// 初始化樹(shù)
$(document).ready(function(){
$.fn.zTree.init($("#coagencyTree"),settingOther);
});
</SCRIPT>
<!-- 樹(shù)節(jié)點(diǎn)id -->
<s:hidden name="coagencyForm.coagencyId" id="coagencyId"/>
<!-- 樹(shù)節(jié)點(diǎn) 父id -->
<s:hidden name="coagencyForm.parentId" id="parentId"/>
<div class="zTreeDemoBackground left">
<ul id="coagencyTree" class="ztree" style="height: 640px"></ul>
</div>
相關(guān)文章
jquery 實(shí)現(xiàn)input輸入什么div圖層顯示什么
這篇文章主要介紹jquery實(shí)現(xiàn)input輸入什么div圖層顯示什么的具體過(guò)程,需要的朋友可以參考下2014-06-06
jQueryUI DatePicker 添加時(shí)分秒
本文主要介紹jQueryUI DatePicker添加時(shí)分秒的方法,簡(jiǎn)單實(shí)用,需要的朋友可以參考下。2016-06-06
jQuery 開(kāi)發(fā)之EasyUI 添加數(shù)據(jù)的實(shí)例
這篇文章主要介紹了jQuery 開(kāi)發(fā)之EasyUI 添加數(shù)據(jù)的實(shí)例的相關(guān)資料,希望通過(guò)本文能幫助到大家,讓大家理解掌握這部分內(nèi)容,需要的朋友可以參考下2017-09-09
網(wǎng)站如何做到完全不需要jQuery也可以滿足簡(jiǎn)單需求
據(jù)統(tǒng)計(jì),目前全世界57.3%的網(wǎng)站使用它。也就是說(shuō),10個(gè)網(wǎng)站里面,有6個(gè)使用jQuery。如果只考察使用工具庫(kù)的網(wǎng)站,這個(gè)比例就會(huì)上升到驚人的91.7%2013-06-06
jQuery實(shí)現(xiàn)輸入框下拉列表樹(shù)插件特效代碼分享
這篇文章主要介紹了jQuery實(shí)現(xiàn)輸入框下拉列表樹(shù)特效,推薦給大家,有需要的小伙伴可以參考下。2015-08-08
SpringMVC框架下JQuery傳遞并解析Json格式的數(shù)據(jù)是如何實(shí)現(xiàn)的
json作為一種輕量級(jí)的數(shù)據(jù)交換格式,在前后臺(tái)數(shù)據(jù)交換中占據(jù)著非常重要的地位。Json的語(yǔ)法非常簡(jiǎn)單,采用的是鍵值對(duì)表示形式,本文給大家介紹SpringMVC框架下JQuery傳遞并解析Json格式的數(shù)據(jù)是如何實(shí)現(xiàn)的,對(duì)spring mvc ajax json相關(guān)知識(shí)感興趣的朋友一起學(xué)習(xí)吧2015-12-12

