// 实现一个名称为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个按钮,每个按钮触发一个事件。 |