📄 1.jsp
字号:
<%@page contentType="text/html;charset=gbk" %>
<html>
<head>
<title>简单的布局例子</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<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/source/locale/ext-lang-zh_CN.js"></script>
</head>
<body>
<div id="north-div"></div>
<div id="center-div">center</div>
<div id="south-div">south</div>
<script>
Ext.onReady(function(){
var tb=new Ext.Toolbar('north-div');//创建一个工具条
tb.add(
new Ext.Toolbar.SplitButton({
text: '文件',
cls: 'x-btn-text-icon blist',
menu : {items: [
{text: '新建', handler:onItemClick},
{text: '保存', handler:onItemClick},
{text: '加载', handler:onItemClick}
]}}),
new Ext.Toolbar.MenuButton({
text: '编辑',
cls: 'x-btn-text-icon blist',
menu : {items: [
{text: '复制', handler:onItemClick},
{text: '粘贴', handler:onItemClick}
]}})
);
var layout1 = new Ext.layout.BorderLayout(document.body,{
north:{toolbar:tb,initialSize:28},
center:{alwaysShowTabs:true,tabPosition:'top'},
south:{initialSize:28}
});
//layout1.beginUpdate();
layout1.add('north', new Ext.Panel('north-div'));
layout1.add('center', new Ext.Panel('center-div','简单的布局例子'));
layout1.add('south', new Ext.Panel('south-div'));
//layout1.restoreState();
//layout1.endUpdate();
function onItemClick(item){
alert(item.text);
}
});
</script>
</body>
</html>⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -