标签:style blog http color os io ar div cti
此文用来记录学习笔记;
今天再来一个例子巩固一下学习的window;
Ext.onReady(function(){
//ex002 : 在组件中添加子组件 ,并进行一系列针对于组件的操作
//在组件中添加子组件:
var win = new Ext.window.Window({
title:"添加子组件实例" ,
width:‘40%‘ ,
height:400 ,
renderTo:Ext.getBody() ,
draggable:false , //不允许拖拽
resizable:false , //不允许改变窗口大小
closable:false, //不显示关闭按钮
collapsible:true , //显示折叠按钮
bodyStyle: ‘background:#ffc; padding:10px;‘ , // 设置样式
html:‘我是window的内容!!‘ ,
//Ext items(array) 配置子组件的配置项
items:[{
//Ext的组件 给我们提供了一个简单的写法 xtype属性去创建组件
xtype:‘panel‘,
width:‘50%‘,
height:100 ,
html:‘我是面板‘
},
//第一种写法
new Ext.button.Button({
text:‘我是按钮‘ ,
handler:function(){
alert(‘执行!!‘);
}
})
//第二种写法
// {
// xtype:‘button‘ ,
// text:‘我是按钮‘,
// handler:function(btn){
// alert(‘我被点击了‘);
// alert(btn.text);
// }
// }
]
});
win.show();
});
1 Ext.onReady(function(){
2
3 //ex002 : 在组件中添加子组件 ,并进行一系列针对于组件的操作
4
5
6 var win = new Ext.Window({
7 id:‘mywin‘ ,
8 title:‘操作组件的形式‘ ,
9 width:500 ,
10 height:300 ,
11 renderTo:Ext.getBody() ,
12 //表示在当前组件的top位置添加一个工具条
13 tbar:[{ //bbar(bottom) lbar(leftbar) rbar(rightbar) fbar(footbar)
14 text:‘按钮1‘ ,
15 handler:function(btn){
16 //组件都会有 up、down 这两个方法(表示向上、或者向下查找) 需要的参数是组件的xtype或者是选择器
17 alert(btn.up(‘window‘).title);
18 }
19 },{
20 text:‘按钮2‘ ,
21 handler:function(btn){
22 //最常用的方式
23 alert(Ext.getCmp(‘mywin‘).title);
24 }
25 },{
26 text:‘按钮3‘ ,
27 handler:function(btn){
28 //以上一级组件的形式去查找 OwnerCt
29 //console.info(btn.ownerCt);
30 alert(btn.ownerCt.ownerCt.title);
31 }
32 }]
33 });
34 win.show();
35
36
37 });
标签:style blog http color os io ar div cti
原文地址:http://www.cnblogs.com/lisr/p/3930381.html