Ext自定义类并添加事件处理

// 实现一个名称为Person的类。有一个Name属性。实例化时添加walk,eat,sleep3个事件。     Person = function(name) {         this.name = name;         this.addEvents("walk","eat","sleep");     }

 

继承Ext.util.Observable的类的控件都可以支持事件，因此让Person类继承Observable。

// 使用Ext.extend让Person继承Ext.util.Observable，并增加了info方法，让它返回Person的信息。     Ext.extend(Person,Ext.util.Observable,{         info:function(event) {             returnthis.name +" is " + event + "ing.";         }     });

 

处理walk,eat,sleep事件

var p = new Person("Mark");     // 这里的on是addEvent的简写形式，功能一样。第一个参数是事件名称，第二个参数是事件发生时调用的方法。     p.on("walk",function() {         Ext.MessageBox.alert("event",p.name + " 在散步。");     });         p.on("eat",function(breakfast,lunch,supper) {         Ext.MessageBox.alert("event",p.name+"要吃" + breakfast+","+lunch+","+supper);     });         p.on("sleep",function(time) {         Ext.MessageBox.alert("event",p.name+"从晚上" + time + "开始休息。");     });

测试：

HTML部分： <inputtype="button"value="walk"id="walk"/> <inputtype="button"value="eat"id="eat"/> <inputtype="button"value="sleep"id="sleep"/>   Js部分： Ext.get("walk").on("click",function() {         p.fireEvent("walk");     });     Ext.get("eat").on("click",function() {         p.fireEvent("eat","早餐","中餐","晚餐");     });     Ext.get("sleep").on("click",function(){         p.fireEvent("sleep",10);     }); 3个按钮，每个按钮触发一个事件。