html
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 <html>
2 <head>
3 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
4 <title>testtreeo</title>
5 <link rel="stylesheet" type="text/css" href="themes/default/easyui.css">
6 <link rel="stylesheet" type="text/css" href="themes/icon.css">
7 <link rel="stylesheet" type="text/css" href="demo.css">
8 <script type="text/javascript" src="jquery-1.7.1.min.js"></script>
9 <script type="text/javascript" src="jquery.easyui.min.js"></script>
10 <script type="text/javascript">
11 var nodekeep="";
12 $(function(){
13 $('#tt').tree({//json.php
14 checkbox:true,
15 url:'json.php?id=1',
16 onDblClick:function(node,param)
17 {
18 //$('#tt').tree('options').url = "json.php?id=1";
19 //param.myattr = 'test'; // or change request parameter
20 //alert(node.id);
21 var nd = node.id;
22 if( nd != -1)
23 {$.ajax({
24 type: "POST",
25 url: "json.php?id=" + node.id,
26 cache: false,
27 async: false,
28 dataType: "json",
29 success: function(data)
30 {//alert(data);
31 if(nodekeep.indexOf(node.id)==-1)
32 {
33 append(data, node);
34 nodeExp = true;
35 }
36 }
37 });
38 }
39 },
40 onClick:function(node){
41 $(this).tree('toggle', node.target);
42 //alert('点击'+node.attributes);
43 }
44 });
45
46
47 });
48 function appends(){
49 var node = $('#tt').tree('getSelected');
50 $('#tt').tree('append',{
51 parent: (node?node.target:null),
52 data:[{
53 text:'new1',
54 checked:true
55 },{
56 text:'new2',
57 state:'closed',
58 children:[{
59 text:'subnew1'
60 },{
61 text:'subnew2'
62 }]
63 }]
64 });
65 }
66
67 function append(datas,cnode)
68 {
69 var node = cnode;
70 $('#tt').tree('append', {
71 parent: node.target,
72 data: datas
73 });
74 nodekeep+=","+node.id;
75 }
76
77 </script>
78 </head>
79 <body>
80 <a href="#" onclick="appends()">append</a>
81 <h2>Tree</h2>
82 <ul id="tt" > </ul>
83
84 </body>
85 </html>
PHP
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
<?PHP
$id = $_GET["id"];
$ta = "";
if ($id==2){
$ta = "[{\"id\":3,\"text\":\"test\",\"children\":[{\"id\":2,\"text\":\"Fruits1\",\"children\":[{\"id\":4,\"text\":\"File1\",\"attributes\":{\"p1\":\"value1\",\"p2\":\"value2\"} }] }]}]";
echo $ta;
}elseif($id==1){
$ta = "[{\"id\":3,\"text\":\"test\"}]";
echo $ta;
}elseif($id==3){
$ta = "[{\"id\":4,\"text\":\"test1\"},{\"id\":5,\"text\":\"test2\"},{\"id\":6,\"text\":\"test3\"},{\"id\":7,\"text\":\"test4\"},{\"id\":8,\"text\":\"test5\"}]";
echo $ta;
}elseif($id==4){
$ta = "[{\"id\":-1,\"text\":\"test\"}]";
echo $ta;
}elseif($id==5){
$ta = "[{\"id\":-1,\"text\":\"test\"}]";
echo $ta;
}elseif($id==6){
$ta = "[{\"id\":-1,\"text\":\"test\"}]";
echo $ta;
}elseif($id==7){
$ta = "[{\"id\":-1,\"text\":\"test\"}]";
echo $ta;
}elseif($id==8){
$ta = "[{\"id\":-1,\"text\":\"test\"}]";
echo $ta;
}//else{
//$ta = "[{\"id\":14,\"text\":\"test\"}]";
//echo $ta;
//}
?>