jquery树形 点击标题展开关闭

<ul class="easyui-tree" 
data-options="animate:true, onClick: function(node){
$(this).tree('toggle', node.target);}"

>

Java代码  

1. $('#tt2').tree({  
2.     checkbox: false,  
3.     dnd:true,  
4.     url: webContext+"/menu/getTemplateMenuItemChild.do?id=0",  
5.     onClick:function(node){//单击事件  
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 
取消编辑节点.