<ul class="easyui-tree"
data-options="animate:true, onClick: function(node){
$(this).tree('toggle', node.target);}"
>
Java代码
1. $('#tt2').tree({
2. false,
3. true,
4. "/menu/getTemplateMenuItemChild.do?id=0",
5. //单击事件
6. this).tree('toggle', node.target);
7. }
8. }
$('#tt').tree(options);
树的数据格式
每个节点可以包含以下属性:
id: 节点ID，这是很重要的加载远程数据
text: 文字显示节点
state: 节点的状态，“开放”或“关闭”，默认为“打开”。 当设置为“关闭”，该节点有子节点，并将它们远程加载
checked: 指示节点是否被选中选中.
attributes: 自定义属性可以被添加到一个节点
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#"
}]
}]
Dependencies
draggable
droppable
属性
Override defaults with $.fn.tree.defaults.
Tree Node is a javascript object which contains following properties:
id: An identity value bind to the node.
text: Text to be showed.
checked: Whether the node is checked.
attributes: Custom attributes bind to the node.
target: Target DOM object.
Properties
名称
类型
描述
默认值
url
string
a一个URL来检索远程数据.
null
method
string
HTTP方法来检索数据.
post
animate
boolean
确定是否显示动画效果当节点展开或折叠.
false
checkbox
boolean
确定是否显示每个节点前的复选框.
false
cascadeCheck
boolean
确定是否级联复选框.
true
onlyLeafCheck
boolean
确定是否显示子节点前的复选框.
false
dnd
boolean
确定是否启用拖放.
false
data
array
节点的数据加载.
null
事件
名称
参数
描述
onClick
node
用户单击一个节点时被激活，节点参数包含下列内容：
ID：节点ID
text：文本节点
checked：是否被选中的节点
attributes：节点自定义属性
target：目标点击DOM对象
onDblClick
node
用户双击一个节点时被激活.
onBeforeLoad
node, param
加载数据前被触发，返回false取消此行为.
onLoadSuccess
node, data
数据加载成功时被触发.
onLoadError
arguments
数据加载失败时触发，参数为“error”的jQuery.ajax方法相同.
onBeforeExpand
node
节点展开时被激活，如果返回false取消此展开行动.
onExpand
node
展开节点时被触发.
onBeforeCollapse
node
节点折叠时被激活，如果返回false取消此行动.
onCollapse
node
节点折叠时被触发.
onCheck
node, checked
用户点击复选框时被触发.
onBeforeSelect
node
节点被选中时被触发，返回false取消此选择的行动.
onSelect
node
选中节点时被触发.
onContextMenu
e, node
节点右击时被触发.
onDrop
target, source, point
一个节点被删除时被触发 target：DOM对象，正在为减少目标的节点.
source：源节点.
point：指示拖放操作，posible值是：“追加”，“顶”或“底部”.
onBeforeEdit
node
编辑节点前被触发.
onAfterEdit
node
编辑节点完成后被触发.
onCancelEdit
node
取消编辑操作时被触发.
方法
名称
参数
描述
options
none
返回树对象.
loadData
data
加载树的数据.
getNode
target
获得指定的节点对象.
getData
target
获得指定的节点包括子节点的数据.
reload
target
刷新树的数据.
getRoot
none
获取根节点，返回节点对象
getRoots
none
获取根节点，返回节点数组.
getParent
target
获取父节点，得到是该节点的DOM对象.
getChildren
target
获取子节点，得到是该节点的DOM对象.
getChecked
none
获取所有复选框选中的节点.
getSelected
none
获取所选节点，并返回它，如果没有节点选择返回null.
isLeaf
target
确定指定的节点是子节点，参数是该节点的DOM对象.
find
id
查找指定节点并返回节点对象.
select
target
选择一个节点，参数是该节点的DOM对象.
check
target
设置指定的节点复选框为选中.
uncheck
target
设置指定的节点复选框为未选中.
collapse
target
关闭一个节点，参数是该节点的DOM对象.
expand
target
展开一个节点，参数是该节点的DOM对象.
collapseAll
target
关闭所有节点.
expandAll
target
展开所有节点.
expandTo
target
展开从根到指定的节点.
append
param
添加一些子节点到父节点. 参数有两个属性：
parent：DOM对象，追加到父节点，如果没有指定，追加到根节点.
data：array，节点数据.
toggle
target
切换展开/折叠节点的状态，参数是该节点的DOM对象.
insert
param
在指定的节点之前或之后插入一个节点. 在“param”参数包含下列内容：
before：DOM对象，节点前插入.
after：DOM对象，节点后插入.
data：对象，节点的数据.
remove
target
删除一个节点和它的子节点，参数是该节点的DOM对象.
pop
target
删除一个节点和它的子节点，该方法是remove一样的，但删除的节点返回节点数据.
update
param
更新指定的节点。 参数具有以下属性：
target（DOM对象，要更新的节点），id,text,iconCls,checked,等.
enableDnd
none
启用拖放功能.
disableDnd
none
禁用拖放功能.
beginEdit
nodeEl
开始编辑一个节点.
endEdit
nodeEl
编辑完一个节点.
cancelEdit
nodeEl
取消编辑节点.
