ExtJS 4 学习1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
<script type="text/javascript" src="ext/bootstrap.js"></script>
<script type="text/javascript" src="ext/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript">
	Ext.onReady(function(){
		/*Ext.Msg.alert("标题",'内容');
		var config = {
			title:"测试标题",
			msg:"测试内容"
		};
		Ext.Msg.alert(config);*/
		
		//定义方式
		/*Ext.create('Ext.panel.Panel',{
			title:'福利性住房业务办理',
			width:400,
			renderTo:Ext.getBody(),
			height:400
		});
		*/
		/*Ext.widget('panel',{//panel是组件的xtype,便于记忆
			title:'第二种',
			width:400,
			renderTo:Ext.getBody(),
			height:400
		});*/
		
		//把声明的组件赋给一个变量,更易于操作
		/*var fwdz = Ext.create('Ext.form.field.Text',{
			fieldLabel:'房屋地址<span class\"color:red\">*</span>',
			name:'fwdz'
		});
		
		var mainPanel = Ext.create('Ext.panel.Panel',{
			title:'我的工作台',
			border:1,
			padding:5,
			layout:'column',
			autoScroll:true,
			items:[{
				padding:5,
				id:'dbsy',
				xtype:'panel',
				title:'待办事宜',
				width:'49%',
				height:200,
				html:'<div>ccccccccccccccccccccccccccccccccc</div>'
			},{
				padding:5,
				id:'wbyx',
				xtype:'panel',
				title:'我的邮箱',
				width:'50%',
				height:200,
				html:'<div>ccccccccccccccccccccccccccccccccc</div>'
			},{
				padding:5,
				id:'zzcl',
				xtype:'panel',
				title:'正在处理',
				width:'49%',
				height:200,
				html:'<div>ccccccccccccccccccccccccccccccccc</div>'
			},{
				padding:5,
				id:'tzgg',
				xtype:'panel',
				title:'通知公告',
				width:'50%',
				height:200,
				html:'<div>ccccccccccccccccccccccccccccccccc</div>'
			}]
		});
		
		mainPanel.render(Ext.getBody());*/
		
	});
	
	//工具条
	var panel = Ext.create('Ext.panel.Panel',{
		title:'我的工作台',
		border:1,
		padding:5,
		height:200,
		autoScroll:true,
		tools:[
			{
				type:'toggle',
				handler:function(){
					//panel.body.mask('正在努力的加载......');
				}
			},
			{type:'close'},
			{type:'minimize'},
			{type:'maximize'},
			{type:'restore'},
			{type:'gear'},
			{type:'pin'},
			{type:'upin'},
			{type:'left'},
			{type:'down'},
			{type:'refresh'},
			{type:'minus'},
			{type:'plus'},
			{type:'help'},
			{type:'search'},
			{type:'save'},
			{type:'print'},
		],
		html:'<div>cccccccccccccccccccccccccccccccccc</div>'
	});
	
	Ext.onReady(function(){
		panel.render(Ext.getBody());
	});
	
</script>
</head>

<body>
</body>
</html>

知识共享许可协议
《ExtJS 4 学习1》常伟华 创作。
采用 知识共享 署名-相同方式共享 3.0 中国大陆 许可协议进行许可。
  • 多说评论
  • 签名
  • 新浪微博
  • 默认评论
  • Tab Header 5

0 条评论 / 点击此处发表评论

Tab Content 5

开发技术


开发平台和工具

sitemap     171.07ms