您的位置：首页 > Web前端 > JavaScript

ExtJs定义树形菜单

2012-08-31 08:46 218 查看

<!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="./ext/resources/css/ext-all.css" />
<script type="text/javascript" src="./ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="./ext/ext-all.js"></script>
</head>
<script type="text/javascript">
Ext.onReady(function(){
// 树形配置开始
var treePanel = new Ext.tree.TreePanel({
id: 'tree-panel',
title: '树形菜单示例',
renderTo:'div1', //北边
split: true, //可以调节大小
width:220,
height: 500, //默认高度为500px
minSize: 150, //最小高度为150px
autoScroll: true,//允许滚动条

// tree-specific configs:
// 树控件的特有的配置选项
rootVisible: false,//隐藏根结点
lines: true,
singleExpand: false,//同时只能打开一个树,当打开其中任何一个树时,将会关闭其他已经打开的树目录
useArrows: true,//树形目录使用visita中树目录显示效果(三角形代替+号)

loader: new Ext.tree.TreeLoader({
dataUrl:'file/tree-data.json'//树目录数据加载为本地json数据文件
}),

root: new Ext.tree.AsyncTreeNode()
});
// 树形配置结束
});
</script>
<body>
<div id='div1'></div>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航