1、引入EXTJS
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css"></link>
<script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext/ext-all.js"></script>
2、helloworld 弹出框
function fn(){
Ext.MessageBox.alert("hello","HelloWorld");
}
Ext.onReady(fn);
3、命名空间和类。和C++ C#类似
注意:js本身并不支持命名空间,这里只是对象的级联.
Ext.namespace("Ext.myModel");
Ext.myModel.Student = Ext.emptyFn; //空的方法
Ext.apply(Ext.myModel.Student.prototype,{
name:"gaotong" //赋默认值
});
var stu = new Ext.myModel.Student();
alert(stu.name);
stu.name="从此醉";
alert(stu.name);
3、定义方法和 字符串输出。
标量写法,JSONf写法
Ext.apply(Ext.myModel.Student.prototype,{
name:"", //赋默认值
age:0,
print:function(){
alert(String.format("name:{0},age:{1}",this.name,this.age));
}
});
4、支持类静态方法
定义:在一个类级别上的共享方法.
Ext.myModel.Student.getConn = function(){
alert("这是静态方法");
}
5、构造方法
Ext.myModel.Student = function(_cfg){
Ext.apply(this, _cfg);
}
Ext.apply(Ext.myModel.Student.prototype,{
name:"", //赋默认值
age:0,
print:function(){
alert(String.format("name:{0},age:{1}",this.name,this.age));
}
});
var stu = new Ext.myModel.Student(
{name:"gaotong2",age:22}
);
6、类继承
StudentImpl 继承 Student
Ext.myModel.Student = function(_cfg){
Ext.apply(this, _cfg);
}
Ext.apply(Ext.myModel.Student.prototype,{
name:"testExtend", //赋默认值
age:0,
print:function(){
alert(String.format("name:{0},age:{1}",this.name,this.age));
}
});
Ext.myModel.StudentImpl = function(_cfg){
Ext.apply(this, _cfg);
}
Ext.extend(Ext.myModel.StudentImpl, Ext.myModel.Student, {
job:"student1",
print:function(){
alert(String.format("name:{0},age:{1},job:{2}",this.name,this.age, this.job));
}
} );
7、事件
例如对于setName(_name)
要继承 Ext.util.Observable
1; fireEvent("nameChange", this, this,name, _name)
2; this.addEvents("nameChange");
3; person.on("nameChange", function(_person, _old, _new){
//do something
});