ExtJs学习一
ExtJs学习一
时间：2012年10月10日22:28:44
ExtJs的hello world:
//在使用ExtJs前要引入下面两个文件
<linkrel="stylesheet"type="text/css"href="extjs/resources/css/ext-all.css">
<script type="text/javascript"src="extjs/ext-all.js"> </script>
//ExtJs中的Ext.onReady就是等页面加载完后执行
(function(){
Ext.onReady(function(){
//alert("aa");
//使用提示框显示hello world
Ext.MessageBox.alert("hello","hello world");
var array=[1,2,3,4,-1,-3,-2];
//遍历数组下的所有元素知道返回fasle停止遍历
Ext.Array.every(array,function(item){
if(item>0)
{
returntrue;
}
else
{
alert(item);
returnfalse;
}
},this);
//遍历数组符合条件的组成新的数组
var newarray=Ext.Array.filter(array,function(item){
if(item>0)
{
returntrue;
}
else
{
returnfalse;
}
},this);
//打印数组，以逗号分隔
alert(newarray.join(","));
输出结果为: 1,2,3,4
});
})();最后还有一对括号
在javascript中创建对象的方法：
Js创建对象常规方法一：
//javascript中类的声明其实就是一个function
/*
function user()
{
//具有this修饰的相当于java类中使用public修饰的可以通过 对象.属性 获取值
this.name="hanhan";
this.age="23";
//使用var修饰的相当于java中使用private修饰的，但是可以通过方法返回
var email="605474293@qq.com";
//为对象指定getEmail方法来获取变量 email的值
this.getEmail=function(){
return email;
}
}
var hanhan=new user();
alert(hanhan.getEmail());
alert(hanhan.age);
alert(hanhan.name);
Js创建对象常规方法二：
//也可以直接创建对象
var person={
name:"hanhan",
age:"23"
};
alert(person["name"]+" "+person.age);
这是javascript中常规的常见对象的方法，但是在extjs中创建对象的方法可以如下:
ExtJs创建对象常规方法一:
直接使用new 类名 的方法
//Ext.window.Window为窗体类
var win=new Ext.window.Window({
width:400,
height:350,
title:"first window"
});
//显示窗体
//win.show();
//单击按钮显示窗体
Ext.get("show").on("click",function(){
win.show();
});
ExtJs创建对象常规方法二:
使用create方法创建对象，参数为类名和配置参数
（推荐使用）
var win2=Ext.create("Ext.window.Window",{
width:400,
height:350,
title:"first window"
});
win2.show();
var o={
say:function(){
alert("Hello world");
}
};
//使用Ext.Function.alias为对象o的方法say取了一个别名fun，使得在别处可以直接调用
var fun=Ext.Function.alias(o,"say");
fun();
输出的结果为: Hello world
ExtJs中自定义类:
//使用Ext.define
Ext.define("mywin",{
//继承的类名
extend:"Ext.window.Window",
width:400,
height:350,
newtitle:"new win",
mySetTitle:function()
{
this.title=this.newtitle;
},
title:"first window",
//initComponent是初始容器的时候，执行的方法
initComponent:function(){
//执行设置title的方法
this.mySetTitle();
this.callParent(arguments);
}
})
//调用mywin
Ext.create("mywin",{
title:"hanhan" //显示的窗体title为new win
}).show();