`

extjs3的“类图”讲解之Ext.util.Observable

阅读更多
Ext.util.Observable:为EXT组件提供处理的最基本功能。
Ext.EventObject:Ext.EventObject包装了浏览器原生的事件对象,格式化了不同 浏览器之间的差异
Ext.EventManager:注册事件处理函数,它们 想要接受一个规格化的EventObject,而不是标准的浏览器事件, 并且直接提供一些有用的事件。例如:鼠标功能按键、onDocumentReady(可以用快捷方式Ext.onReady()进行访问。)
Employee = Ext.extend(Ext.util.Observable, {
			constructor : function(config) {
				this.name = config.name;
				this.addEvents({
							"fired" : true,
							"quit" : true
						});

				// 拷贝配置的监听器到*this*对象里,使得基础类的
				// 构造器将会被添加。
				this.listeners = config.listeners;

				// 调用我们父类的构造器来完成构造过程。
				Employee.superclass.constructor.call(this, config)
			}
		});

Ext.onReady(function() {
/*
			var newEmployee = new Employee({
						// name : 'tom',
						// listeners : {
						// quit : function() {
						// // 使用 default, 则"this"将会是触发事件的对象。
						// alert(this.name + " has quit!");
						// }
						// }

						name : 'tom'
					});

			newEmployee.on('quit', function() {
						Ext.Msg.alert(this.name + " has quit!");
					});

			Ext.get('emp').on('click', function() {
						newEmployee.fireEvent('quit');
					});
*/
	
			Ext.get('emp').on('keypress',function(e){
					if(e.charCode==Ext.EventObject.SPACE){
						Ext.Msg.alert("info","你点击了空格键")
					}
			})
		});

分享到:
评论

相关推荐

    精通JS脚本之ExtJS框架.part2.rar

    《精通JS脚本之ExtJS框架》由浅入深地讲解了ExtJS在Web开发中的相关技术。本书共分17章,分别介绍了JavaScript的对象编程、JavaScript浏览器对象模型和事件机制、ExtJS的核心类库和组件、ExtJS的事件处理方式、设计...

    精通JS脚本之ExtJS框架.part1.rar

    《精通JS脚本之ExtJS框架》由浅入深地讲解了ExtJS在Web开发中的相关技术。本书共分17章,分别介绍了JavaScript的对象编程、JavaScript浏览器对象模型和事件机制、ExtJS的核心类库和组件、ExtJS的事件处理方式、设计...

    EXT 登录的设计 extjs4.0

    EXTJS中的 `Ext.util.Observable` 类提供了一套事件系统,允许你在组件间进行通信。 7. **验证(Validation)**:EXTJS 4.0 提供了强大的表单验证功能,可以通过 `Ext.form.field.VTypes` 或自定义验证函数确保用户...

    Ext Js权威指南(.zip.001

    5.3.2 为组件添加事件接口:ext.util.observable / 188 5.3.3 为组件绑定事件 / 189 5.3.4 内部事件的触发过程 / 192 5.3.5 移除事件 / 194 5.4 特定功能的事件对象 / 196 5.4.1 延时任务:ext.util....

    ExtJS_3.0_Class Diagram

    `Ext.util.Observable`是事件驱动的基础类,它提供了添加和移除监听器(addListener、removeListener)、捕获和释放事件(capture、releaseCapture)以及观察类(observeClass)等方法,是实现事件监听和响应的核心...

    深入浅出ExtJS第2版

    2.1.4 Ext.util.Observable 14 2.1.5 Ext.EventManager 17 2.1.6 Ext.EventObject 19 2.2 EXT的核心组件 20 2.2.1 Ext.Component 20 2.2.2 Ext.BoxComponent 22 2.2.3 Ext.Container 23 2.2.4 Ext.Panel 24 ...

    EXtJS学习 EXtJS学习

    var BaseClass = Ext.extend(Ext.util.Observable, { arr: [], init: Ext.emptyFn }); var SubClass1 = Ext.extend(BaseClass, { init: function() { this.arr.push(1); } }); var SubClass2 = Ext.extend...

    ExtJs4新类库特性详解及JS新语法扩展.docx

    - **源文件组织**:类名与源文件路径匹配,如`Ext.util.Observable.js`。所有类应存储在`src`目录下,并遵循相应的路径结构。 - **方法和成员变量**:方法和成员变量的命名遵循驼峰命名法,首字母小写。例如,`...

    EXTJS中基于事件的编程探究.pdf

    EXT.util.Observable类是EXTJS中事件监听和响应的基础,任何继承自EXT.util.Observable的类都拥有fireEvent和addListener两个方法,分别用于触发事件和添加事件响应。 在EXTJS中,触发一个事件需要调用fireEvent...

    ExtJs中简单的登录界面制作方法

    一 首先请看图片 二 登陆界面Ext代码 代码如下: /// ”... //主应用程序 XQH.ExtJs.Frame.app = function() { } Ext.extend(XQH.ExtJs.Frame.app, Ext.util.Observable, { LoginLogo:new Ext.

    Ext_类的详细介绍

    通过上述介绍,我们可以看出 **Ext.lib.Event** 和 **Ext.util.Observable** 在 ExtJS 库中分别承担着不同的职责,但都是处理事件的关键部分。理解这两个类的工作原理和使用方法对于高效地使用 ExtJS 开发复杂用户...

    老师整理的extjs学习笔记

    ExtJS 中的所有组件都继承自 `Ext.Component` 类,而 `Ext.Component` 又继承自 `Ext.util.Observable` 类。这意味着所有的组件都具有事件管理的能力。 **3.2 ExtJS 常用组件的继承关系及其管理** ExtJS 提供了...

    Ext API详解--笔记

    `EXT核心API详解(一) - Ext类.txt`介绍了Ext的基础类,包括`Ext.util.Observable`(观察者模式的实现)、`Ext.app.Application`(管理应用生命周期)等。理解这些类的用法对于构建可维护的应用至关重要。 4. **Ext...

    ExtJS设计模式

    - **Ext.Component** 类及其子类都继承自`Ext.util.Observable`,这使得所有组件都能够作为观察者使用。 - 开发者可以通过`addEvents`、`addListener`等方法为组件添加自定义事件以及注册监听器。 - **示例代码**: ...

    4.0Ext 类系统

    例如,`Ext.util.Observable` 对应 `path/to/src/Ext/util/Observable.js`。 4. **方法和变量** 方法名和变量名也应遵循驼峰命名法,如 `encodeUsingMd5()` 和 `isGoodName`。 5. **静态属性** 对于常量,尤其是类的...

    Ext中文帮助文档(Ext常见界面源码,及类库方法详解)

    2. Ext.util.Observable:观察者模式实现,用于事件监听和触发。 3. Ext.data.Store:数据存储,与数据源进行交互,支持远程数据加载和本地数据存储。 4. Ext.grid.GridPanel:表格组件的主要类,包含了数据绑定、列...

    Extjs4 API文档阅读(一)——类系统(Class System)

    - `Ext.util.Observable` 存放在 `path/to/src/Ext/util/Observable.js` - `Ext.form.action.Submit` 存放在 `path/to/src/Ext/form/action/Submit.js` - `MyCompany.chart.axis.Numeric` 存放在 `path/to/src/My...

Global site tag (gtag.js) - Google Analytics