<html>
<head>
<title> New Document </title>
<link rel="stylesheet" type="text/css" href="../resources/css/ext-all.css" />
<script type="text/javascript" src="../adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../ext-all.js"></script>
</head>
<body>
<script type="text/javascript">
Ext.onReady(function(){
//定義樹的跟節(jié)點(diǎn)
var root=new Ext.tree.TreeNode({
id:"root",//根節(jié)點(diǎn)id
text:"我是樹根"
});
//定義樹節(jié)點(diǎn)
var c1=new Ext.tree.TreeNode({
id:'c1',//子結(jié)點(diǎn)id
text:'我是大兒子'
});
var c2=new Ext.tree.TreeNode({
id:'c2',
text:'我是小兒子,請點(diǎn)擊我',
icon:'im2.gif',//自定義節(jié)點(diǎn)圖標(biāo)
href:'http://www.extshow.com/',//添加超鏈接
hrefTarget:'_blank'//新窗口打開鏈接
});
var c22=new Ext.tree.TreeNode({
id:'c22',
text:'我是大孫子,請點(diǎn)擊我'
});
root.appendChild(c1);//為根節(jié)點(diǎn)增加子結(jié)點(diǎn)c1
root.appendChild(c2);//為c1增加子節(jié)點(diǎn)c2,相信你已經(jīng)找到規(guī)律了吧^_^
c1.appendChild(c22);//為c1增加子節(jié)點(diǎn)c22
//生成樹形面板
var tree=new Ext.tree.TreePanel({
renderTo:"show",
root:root,//定位到根節(jié)點(diǎn)
animate:true,//開啟動畫效果
enableDD:false,//不允許子節(jié)點(diǎn)拖動
border:false,//沒有邊框
rootVisible:true//設(shè)為false將隱藏根節(jié)點(diǎn),很多情況下,我們選擇隱藏根節(jié)點(diǎn)增加美觀性
});
//增加點(diǎn)擊事件
c22.on('click',function(node){
alert('我是:"'+node.text+'",我的id是:"'+node.id+'"');//這里增加你所需要的點(diǎn)擊事件
});
})
</script>
<div id="show"></div>
</body>
</html>