EXT事件队列

来源：互联网发布：昆明行知中学地址编辑：程序博客网时间：2024/06/07 00:20
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>  <head>    <title>事件队列</title>     <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">    <meta http-equiv="description" content="this is my page">    <meta http-equiv="content-type" content="text/html; charset=UTF-8">         <link rel="stylesheet" type="text/css" href="../../ext/resources/css/ext-all.css"> <script type="text/javascript" src="../../ext/adapter/ext/ext-base.js"></script> <script type="text/javascript" src="../../ext/ext-all.js"></script> <script type="text/javascript">  Person = function(){   // 注册事件   this.addEvents("idChangeEvent","nameChangeEvent");  };  Ext.extend(Person,Ext.util.Observable,{   id:0,   name:"",   setId:function(_id) {    if (this.id != _id) {     // 发布事件     this.fireEvent("idChangeEvent",this,this.id,_id);     // 如果新的id与原来的id不一样，则将新的id的值设置到当前对象的id上。     this.id = _id;    }   },   setName:function(_name){    if (this.name != _name) {     // 发布事件     this.fireEvent("nameChangeEvent",this,this.name,_name);     this.name = _name;    }   },   print:function(){    alert(String.format("id={0},name={1}",this.id,this.name));   }  });    var person = null;  btn_click = function(){   person.setId(prompt("请输入编号："));   person.setName(prompt("请输入姓名："));  };    Ext.onReady(function(){   var id_txt = Ext.get('id_txt');   var name_txt = Ext.get('name_txt');   person = new Person();   /**   * idChangeEvent事件触发2次，   * 第一次用来设置文本框的值。   * 第二次用来设置文档的标题。    */   person.on('idChangeEvent',function(person,old,_new){    id_txt.dom.value = _new;   });   person.on('nameChangeEvent',function(person,old,_new){    name_txt.dom.value = _new;   });   person.on('idChangeEvent',function(person,old,_new){    document.title = _new;   });  });   </script>  </head>    <body>    <h4>Ext事件队列</h4>    编号：<input type='text' id='id_txt' disabled="disabled"><br>    姓名：<input type='text' id='name_txt' disabled="disabled"><br>    <input type="button" onclick="btn_click();" value='输入信息'>    <input type="button" onclick="person.print();" value='获取输入信息'>      </body></html>
效果图：
单击“获取输入信息”。