EXTJS之Ext.util.Observable自定义事件

暂时还不会用Ext.mixin.Observable,

催悲的测试了近两个小时。这TMD的语法差距也太大了啊。。

在新版EXTJS里,已去除了addEvents。

弄个出来,大概知道下吧。

<!DOCTYPE html>
<html>
<head>
    <title>ExtJs</title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link rel="stylesheet" type="text/css" href="ExtJs/packages/ext-theme-crisp/build/resources/ext-theme-crisp-all.css">
		<script type="text/javascript" src="ExtJs/ext-all.js"></script>
		<script type="text/javascript" src="ExtJs/bootstrap.js"></script>
		<script type="text/javascript" src="ExtJs/packages/ext-theme-crisp/build/ext-theme-crisp.js"></script>

    <script type="text/javascript">
    Ext.onReady(function(){

      var name=Ext.extend(Ext.util.Observable,{
          constructor:function(config){
              this.name=config.name;
              this.id=config.id;
              //this.addEvents("fire","quite");
              this.listeners=config.listeners;
              name.superclass.constructor.call(this,config);
          }
      });

      var username=new name({
        name:"Test",
        id:"001",
        listeners:{
            "fire":function(){alert(username.name);}
        }
      });

      Ext.get(‘walk‘).on(‘click‘, function() {
        username.fireEvent(‘fire‘);
      });
    });
    </script>
</head>
<body style="margin: 20px">
  <button id="walk">walk</button>
  <button id="eat">eat</button>
  <button id="sleep">sleep</button>
</body>
</html>

  

时间: 2024-10-07 13:56:06

EXTJS之Ext.util.Observable自定义事件的相关文章

ExtJs之自定义事件

1.新建一个实践类 1 Employee = function(name) 2 { 3 4 this.name = name; 5 6 this.addEvents({ 7 8 "fired" : true, 9 10 "quit" : true 11 12 }); 13 14 } 15 16 Ext.extend(Employee, Ext.util.Observable,{}); 2.绑定相关事件,这里用的事件类本身的引用 TODO 考虑怎么用其他的对象 1 v

ExtJS学习--------Ext.Element中的常用事件和其他重要的方法学习(实例)

常用事件: 其他重要方法: 具体实例:(实例结果可以将对应的代码取消注释进行测试) Ext.onReady(function(){ Ext.create('Ext.panel.Panel',{ title:'我的面板' , width:'100%' , height:400 , renderTo:Ext.getBody(), html:'<div id=d1><span id=sp>我是sp的内容</span><div id=d2>我是d2的内容</d

ExtJs之Ext.data.Store

ExtJs之Ext.data.Store Posted on 2009-07-21 09:09 linFen 阅读(44912) 评论(5) 编辑 收藏 Store.getCount()返回的是store中的所有数据记录,然后使用for循环遍历整个store,从而得到每条记录. 除了使用getCount()的方法外,还可以使用each()函数,如下面的代码所示. store.each(function(record) { alert(record.get('name')); }); Each()

[ExtJS学习笔记]第七节 Extjs的组件components及其模板事件方法学习

本文地址:http://blog.csdn.net/sushengmiyan/article/details/38487519 本文作者:sushengmiyan -------------------------------------------------------------资源链接----------------------------------------------------------------------- 翻译来源  Sencha Cmd官方网站: http://ww

javascript和jquey的自定义事件小结

“通过事件机制,可以将类设计为独立的模块,通过事件对外通信,提高了程序的开发效率.” 可以把多个关联但逻辑复杂的操作利用自定义事件的机制灵活地控制好 对象之间通过直接方法调用来交互 1)对象A直接调用对象B的某个方法,实现交互:直接方法调用本质上也是属于一种特殊的发送与接受消息,它把发送消息和接收消息合并为一个动作完成: 方法调用方和被调用方被紧密耦合在一起:因为发送消息和接收消息是在一个动作内完成,所以无法做到消息的异步发送和接收: 2)对象A生成消息->将消息通知给一个事件消息处理器(Obs

Javascript框架的自定义事件(转)

很多 javascript 框架都提供了自定义事件(custom events),例如 jquery.yui 以及 dojo 都支持"document ready"事件.而部分自定义事件是源自回调(callback). 回调将多个事件句柄存储在数组中,当满足触发条件时,回调系统则会从数组中获取对应的句柄并执行.那么,这会有什么陷阱呢?在回答这个问题之前,我们先看下代码. 下面是两段代码依次绑定到 domcontentloaded 事件中 document.addeventlistene

wpf自定义控件中使用自定义事件

wpf自定义控件中使用自定义事件 1 创建自定义控件及自定义事件 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36     /// <summary>     /// 演示用的自定义控件     /// </summary>     public class ExtButton : Button     {         public

extJS 中 ext.data 介绍

ext.data 最主要的功能是获取和组织数据结构,并和特定控件联系起来,于是,Ext.data成了数据的来源,负责显示数据. Ext.data在命名空间中定义了一系列store.reader和proxy.Grid和ComboxBox都是以Ext.data为媒介获取数据的,它包含异步加载.类型转换.分页等功能. Ext.data默认支持Array.JSON.XML等数据格式,可以通过Memory.HTTP.ScriptTag等方式获得这些格式的数据.如果要实现新的协议和新的数据结构,只需要扩展r

Ext.util.Format.date与Ext.Date.format区别, 转换时间戳

在Extjs中装时间戳使用如下两种都可以: Ext.util.Format.date(time,'U'); Ext.Date.format(time, 'U'); 为了找到它们的区别,查看源代码,以Extjs 4.2 为例 Ext.util.Format.date -> \src\util\Format.js 258 date: function(v, format) { if (!v) { return ""; } if (!Ext.isDate(v)) { v = new D