<html> <head> <meta charset="UTF-8" /> <title>ext_st_index</title> <link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css" /> <script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script> <script type="text/javascript" src="extjs/ext-all.js"></script> <script type="text/javascript" src="extjs/src/locale/ext-lang-zh_CN.js"></script> </head> <body> <script> Ext.onReady(function(){ var top = new Ext.Panel({ region: 'north', title: 'title', html: '33333', autoHeight: true, height: 200, border: false, margins: '0 0 5 0' }); var center = new Ext.TabPanel({ region: 'center', items:{ id:'index', title:'首页', html:'欢迎进入小说管理系统' }, enableTabScroll:true }); center.setActiveTab('index'); var root = new Ext.tree.TreeNode({ id:'root', text : '根节点' }); var node1 = new Ext.tree.TreeNode({ text : '书籍类型维护', id:node1 }); var node2 = new Ext.tree.TreeNode({ text : '书籍维护', id: node2, url : 'www.qidian.com' }); var node11 = new Ext.tree.TreeNode({ text : '添加书籍类型维护', url : '5-21.html', }); var node12 = new Ext.tree.TreeNode({ text : '删除书籍类型维护', url : 'http://www.baidu.com' }); node1.appendChild(node11); node1.appendChild(node12); root.appendChild(node1); root.appendChild(node2); var left = new Ext.tree.TreePanel({ region: 'west', xtype: 'treepanel', collapsible: true, title: 'Navigation', width: 200, autoScroll: true, split: true, //root:root, listeners: { click: function(n) { var url= n.attributes.url; var id= n.attributes.id; //alert(id+'-----'+url); var p = center.getItem(id); if(url){ if(p){ center.setActiveTab(p); }else{ p= new Ext.Panel({ title:n.attributes.text, autoLoad:{url:url,scripts:true}, closable:true, id:id }); center.add(p); center.setActiveTab(p); } } } } }); left.setRootNode(root); var bottom = new Ext.Panel({ region: 'south', title: 'Information', collapsible: true, html: '版权所有', split: true, height: 100, minHeight: 100 }); var vp = new Ext.Viewport({ layout:'border', items:[top,left,center,bottom], renderTo : Ext.getBody() }); left.expandAll(); }); </script> </body> </html>
详细解决方案
一个简略的后台布局
热度:58 发布时间:2012-11-09 10:18:48.0
相关解决方案