jQuery EasyUI学习03：tree控件整理[亲测有效]

云烟 • 2023年 8月 8日下午9:00 • 未分类

欢迎大家来到IT世界,在知识的湖畔探索吧!

树控件的使用

node对象格式：

id：绑定节点的标识值。

text：显示的节点文本。

iconCls：显示的节点图标CSS类ID。

checked：该节点是否被选中。

state：节点状态，’open’ 或 ‘closed’。

attributes：绑定该节点的自定义属性。

children: 一个节点数组声明了若干节点。

注意1.调试object对象：

console.info(node); 在控制台输出对象。点击会显示详细信息

注意2:获取子节点的两种方式：

通过getChildren方法获取

$(“#easyUITree”).tree(“getChildren”,node)
通过children参数获取

例如：

[{
“id”:1,
“text”:”Folder1″,
“iconCls”:”icon-save”,
“children”:[{
“text”:”File1″,
“checked”:true
},{
“text”:”Books”,
“state”:”open”,
“attributes”:{
“url”:”/demo/book/abc”,
“price”:100
},
“children”:[{
“text”:”PhotoShop”,
“checked”:true
},{
“id”: 8,
“text”:”Sub Bookds”,
“state”:”closed”
}]
}]
},{
“text”:”Languages”,
“state”:”closed”,
“children”:[{
“text”:”Java”
},{
“text”:”C#”
}]
}]

$(function(){

$(“#easyUITree”).tree({

url:”treedata.json”,

//定义是否启用拖拽功能。

dnd:true,

//定义节点在展开或折叠的时候是否显示动画效果。

animate:true,

//定义是否在每一个借点之前都显示复选框。

checkbox:true,

//定义是否显示树控件上的虚线。

lines:true,

onClick:function(node){

//alert(node.text);

//控制台打印

//console.info(node);

//$(“#easyUITree”).tree(“getChildren”,node)

var children=node.children;

alert(children.length)

}

})

</script>

——-

免责声明：本站所有文章内容,图片，视频等均是来源于用户投稿和互联网及文摘转载整编而成，不代表本站观点，不承担相关法律责任。其著作权各归其原作者或其出版社所有。如发现本站有涉嫌抄袭侵权/违法违规的内容,侵犯到您的权益，请在线联系站长,一经查实,本站将立刻删除。本文来自网络,若有侵权，请联系删除，如若转载，请注明出处：https://itzsg.com/22980.html