java ext_JAVA之EXT----Ext.EventObject

转载地址：http://book.51cto.com/art/201004/195543.htm

2.1.6　Ext.EventObject

2010-04-20 19:35 徐会生/康爱媛/何启伟 人民邮电出版社

《深入浅出Ext

JS(第2版)》第2章EXT框架基础，本章主要介绍EXT的事件模型和核心组件，并通过实例详细讲解了事件模型的使用方法。此外，还展示EXT中的组件继承图，并对其中的常用组件进行了详细讲解。本节为大家介绍Ext.EventObject。

AD：

2.1.6　Ext.EventObject

Ext.EventObject是对事件的封装，它将EXT自定义事件和浏览器事件结合在一起使用。除此之外，它还提供了丰富的辅助工具函数，帮助我们获得事件相关的信息。

Ext.EventObject定义了一系列的功能按键，处理按键事件时不用再去硬背ASCII码了，这些功能按键如表2-1所示。

表2-1　Ext.EventObject中按键的映射关系

Ext.EventObject

中的名称

ASCII码

Ext.EventObject

中的名称

ASCII码

BACKSPACE

8

PAGEDOWN

34

TAB

9

END

35

RETURN

13

HOME

36

ENTER

13

LEFT

37

SHIFT

16

UP

38

CONTROL

17

RIGHT

39

ESC

27

DOWN

40

SPACE

32

DELETE

46

PAGEUP

33

F5

116

下面利用一个input type=text的输入文本框来演示监听用户按键事件，并在用户输入空格时提示，如下面的代码所示。

Ext.get('text').on('keypress', function(e) {

if (e.charCode== Ext.EventObject.SPACE) {

Ext.Msg.alert('info', '空格');

}

});

这个示例在用户按下空格时弹出alert提示框。注意监听函数的参数e，其实它就是一个Ext.EventObject的实例，它的

charCode代表了刚才按下按钮的ASCII码。我们将它与Ext.EventObject.SPACE相比较，判断当前按键是否是空格。

Ext.EventObject是对事件的封装，如果我们想得到原始的浏览器事件，可以通过Ext.EventObject的

browserEvent来获得。不过，这可是未经任何加工处理的原生事件，在不同的浏览器上可能存在着很大的差异，所以还是建议使用

Ext.EventObject。

通过Ext.EventObject的文档可以了解到，它包含的许多工具函数都与Ext.lib.Event中的函数是重名的，如

getPageX()、getPageY()、getPageXY()、getTarget()和getRelated-

Target()等。这些函数实际上都是通过Ext.lib.Event实现的，Ext.EventObject代表浏览器事件，在内部使用

Ext.lib.Event处理对应的browserEvent。

Ext.EventObject对Ext.lib.Event扩展的部分是对鼠标事件和按键事件的增强，它可以判断ALT、CTRL、SHIFT这

些功能键是否被按下。既可以单独使用altKey、ctrlKey和shiftKey判断是否有功能键被按下，也可以使用hasModifier()判断

是否有功能键被按下。这个功能一般要与其他的按键状态相配合，用于判断组合按键的情况。

Ext.EventObject提供的另一个有趣的功能函数名称为getWheelDelta()，可以获得鼠标滚轮的delta值。在下面的示例

中，我们监听了mousewheel事件，在滚轮转动时动态修改test这个div的宽度，这样又给我们提供了一种提升用户体验的方法，如下面的代码所

示。

Ext.get(document.body).on('mousewheel', function(e) {

vardelta= e.getWheelDelta();

vartest=Ext.get('test');

varwidth=test.getWidth();

test.setWidth(width + delta * 500, true);

});

【责任编辑：云霞 TEL：(010)68476606】