ExtJs提供了一套强大的事件处理机制,通过这些事件处理机制来响应用户的动作、监控控件状态变化、更新控件视图信息、与服务器进行交互等等。
首先我们来看下标准的html事件处理
<script type="text/javascript">
function a(){
alert("hello");
}
window.onload=function(){
document.getElementById("btnalter").onclick=a;
}
</script>
<input id="btnalter" type="button" value="alter网页对话狂样式">
运行结果是:
点击按钮会触发onclick事件,并执行onclick事件处理中指定的代码,即a函数,弹出一个对话框
ExtJs中事件处理,与上述类似,如下:
<script type="text/javascript">
function a(){
alert("hello");
}
function aa(){
alert("hello liulimin");
}
Ext.onReady(function(){
Ext.get("btnalter1").addListener("click",as);
Ext.get("btnalter1").on("click",aa);
});
</script>
<input id="btnalter1" type="button" value="alter ExtJs样式对话框">
注:1、可以直接调用该对象中的addListener方法,为对象添加事件
addListener方法中,第一个参数表示事件处理方法,第二个参数表示事件处理器或整个处理函数,
同时还可以对某个对象添加多个事件响应函数
2、addListener函数可以用简写on来代替,上述为btnalter1添加了2个事件处理,所以在运行时会弹出两个对话框