<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>基本樹形菜單展現</title>
<meta http-equiv="content-type" content="text/html; charset=gbk">
<link rel="stylesheet" type="text/css" href="css/ext-all.css" />
<script type="text/javascript" src="js/ext-base.js"></script>
<script type="text/javascript" src="js/ext-all.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
var root=new Ext.tree.AsyncTreeNode({
id:"root",
text:"樹的根",
leaf:false,
children:[
{
id: 1,
text: '子節點1',
leaf: true
},{
id: 2,
text: '兒子節點2',
children: [{
id: 3,
text: '孫子節點',
leaf: true
}]
}
]
});
var tree=new Ext.tree.TreePanel({
renderTo:"tree",
animate:true,//以動畫形式伸展,收縮子節點
title:"Extjs靜態樹",
collapsible:true,//如果爲true，panel是可收縮的，並且有一個收起/展開按鈕自動被渲染到它的頭部工具區域
rootVisible:true,//是否顯示根節點
autoScroll:false,
autoHeight:true,
root:root,
loader: new Ext.tree.TreeLoader(),
width:150
});
});
</script>
<body>
<div id="tree"></div>
</body>
</html>
