<!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>