ExtJs组件之事件处理

来源：互联网发布：林更新斥网络智障编辑：程序博客网时间：2024/05/16 14:51

事件统一由
Ext.EventManager 对象管理，与浏览器W3C 标准事件对象Event 相对应，Ext 封装了一个
Ext.EventObject 事件对象。支持事件处理的类(或接口)为Ext.util.Observable，凡是继承该类
的组件或类都支持往对象中添加事件处理及响应功能。

example01

<html><head><meta http-equiv="Content-Type" content="text/html; charset=GBk"/><title>ExtJS</title><link rel="stylesheet" type="text/css" href="../../extjs/resources/css/ext-all.css"/><script type="text/javascript" src="../../extjs/adapter/ext/ext-base.js"></script><script type="text/javascript" src="../../extjs/ext-all.js"></script><script>function   a(){Ext.MessageBox.alert("hello","Hello,easyjf open source");}</script></head><body><input id="btnAlert" type="button" onclick="a();" value="消息框" /></body></html>

example02：这段代码在文档加载的时候，就直接对btnAlert 的onclick 赋值，非常清晰的指明了
按钮btnAlert 的onclick 事件响应函数为a

<html><head><meta http-equiv="Content-Type" content="text/html; charset=GBk"/><title>ExtJS</title><link rel="stylesheet" type="text/css" href="../../extjs/resources/css/ext-all.css"/><script type="text/javascript" src="../../extjs/adapter/ext/ext-base.js"></script><script type="text/javascript" src="../../extjs/ext-all.js"></script><script>function   a(){Ext.MessageBox.alert("hello","Hello,easyjf open source");}window.onload = function(){document.getElementById("btnAlert").onclick=a;}</script></head><body><input id="btnAlert" type="button"  value="消息框" /></body></html>

example03

<html><head><meta http-equiv="Content-Type" content="text/html; charset=GBk"/><title>ExtJS</title><link rel="stylesheet" type="text/css" href="../../extjs/resources/css/ext-all.css"/><script type="text/javascript" src="../../extjs/adapter/ext/ext-base.js"></script><script type="text/javascript" src="../../extjs/ext-all.js"></script><script>function a(){alert('some thing');}Ext.onReady(function(){Ext.get("btnAlert").addListener("click",a);});</script></head><body><input id="btnAlert" type="button"  value="消息框" /></body></html>