浏览器标准事件、IE事件以及jQuery事件的细节

Event

标准事件、IE事件以及jQuery事件的细节

 

当事件处理程序被调用时,一个Event对象会传入,该对象的属性给出事件的细节,比如事件的类型以及发生事件的元素。Event对象的方法可以控制事件的传播。所有现代浏览器都实现了一个标准事件模型,除了IEIE8及更早的版本定义了不兼容的专有事件模型。这里归档标准事件模型的属性和方法以及对象的IE方案,也包括jQuery事件对象,后者在IE上模拟了一个标准的事件对象。

 

在标准事件模型中,不同种类的事件有与其相关联的不同的事件对象:比如,鼠标事件有一个具有鼠标相关属性的MouseEvent对象,键盘事件有一个具有键盘相关属性的KeyEvent对象。MouseEventKeyEvent共享一个通用的Event超类。不过,在IEjQuery事件模型中,Element对象上发生的所有事件都只使用一个单独的Event对象。在一个鼠标事件中,Event对象的与键盘事件相关的属性是没有意义的,但这些属性仍然会定义。为简单起见,这儿合并了事件层次结构,对所有可被分发到Element对象(然后冒泡到DocumentWindow对象)的事件属性编写了文档。

 

本来,几乎所有客户端JavaScript事件都是在文档元素上触发的,也很自然地应该把文档相关的事件对象的属性合并在一起。不过HTML5和相关标准引入了一些新的事件类型,这些事件在非文档元素上触发。这些事件类型经常具有自己的Event类型,这些类型在它们自己的参考页面有介绍。参见BeforeUnloadEventCloseEventErrorEventHashChangeEventMessageEventPageTransitionEventPopStateEventProgressEventStorageEvent

 

这些事件对象类型大多数都扩展了Event。其他新的HTML5相关的事件类型没有定义专有的事件对象类型——与这些事件相关联的对象只是一个普通的Event对象。这里归档这个“普通”Event对象加上它的一些子类型的属性。下面带星号的属性是由Event类型自己定义的,这些属性继承自MessageEvent等事件类型,一般为简单的、普通的事件,如window对象的load事件和MediaElement对象的播放事件定义这些属性。

 

常量

这些常量定义eventPhase属性的值。IE事件模型不支持这个属性以及这些常量。

unsigned short CAPTURING_PHASE = 1

    事件正分发给的它的目标的祖先的捕获事件处理程序

unsigned short AT_TARGET = 2

    事件正在它的目标上分发

unsigned short BUBBLING_PHASE = 3

    事件正在冒泡,同时正在它的目标的祖先上分发

 

属性

这儿列出的属性是由标准事件模型定义的,适用于Event对象,也适用于鼠标及键盘相关的事件对象。这儿也列出了IEjQuery事件模型的属性。带星号的属性是由Event直接定义的,在任何标准Event对象上总是可用的,无论这个事件是什么类型。

 

readonly boolean altKey

    事件发生时Alt键是否按下。适用于鼠标、键盘事件以及IE事件

 

readonly boolean bubbles *

    如果事件会冒泡(除非调用stopPropagation())则此属性为true;否则为falseIE事件未定义这个属性。

 

readonly unsigned short button

    在一个mousedownmouseupclick事件中,哪个鼠标按键改变了状态。值为0表示左键,值为2表示右键,值为1表示鼠标的中键。注意,这个属性在按键改变状态时定义,所以,例如,不可用于报告在一个mousemove事件中某个按键是否一直按下。同时,这个属性也不是一个位图:它不能告诉你除一个键按下之外的更多信息。最后,有些浏览器只生成左键点击的事件。

    IE事件定义一个不兼容的button属性。在IE中,这个属性是一个位掩码:如果左键按下则1位被设置,右键按下则2位被设置,(三键鼠标的)中键按下则4位被设置。

    jQuery没有模拟IE的标准button属性,但参考了which属性。

 

readonly boolean cancelable *

    如果事件的默认操作可以用preventDefault()来取消则为true;否则为false。所有标准事件类型都定义了这个属性,除了IE事件。

 

boolean cancelBubble

    IE事件模型中,如果一个事件处理程序想阻止一个事件向上冒泡到包含它的对象,必须设置这个属性为true。对于标准事件使用的是stopPropagation()

 

readonly integer charCode

    适用于按键事件,这个属性的值为引发事件的可打印字符的Unicode编码。对于不可打印的功能键来说,这个属性的值为0,同时,这个属性不适用于keydownkeyup事件。可以使用String.fromCharCode()来将这个值转为字符。在大多数浏览器中,发生按键事件时keyCode的值和这个属性的值一样。但在Firefox中,按键事件没有定义keyCode,必须使用charCode。这个事件不是标准事件,在IE事件中未定义,jQuery也没有对其进行模拟。

 

readonly long clientX

readonly long clientY

    鼠标相对于客户端区域(client area)或浏览器窗口的XY坐标。注意,这两个坐标没有包含文档滚动条滚动的值;如果一个事件在窗口的最上方发生,无论文档上方已经滚动了多少,clientY的值都将是0。这两个属性适用于所有类型的鼠标事件。IE事件和标准事件都定义了这两个属性。也可参考pageXpageY

 

readonly boolean ctrlKey

    事件发生时Ctrl键是否按下。适用于鼠标和键盘事件,也适用于IE事件。

 

readonly EventTarget currentTarget *

    当前正在处理这个事件的ElementDocumentWindow。在捕获或冒泡阶段,它和target不一致。IE事件没有定义这个属性,不过jQuery事件模拟了这个属性。

 

readonly DataTransfer dataTransfer

    适用于拖放事件,这个属性定义了协调整个拖放操作的DataTransfer对象。拖放事件是一种鼠标事件;有这个属性的事件仍然会有clientXclientY以及其他鼠标事件属性。拖放事件包括拖动源上的dragstartdragdragend以及放置目标上的dragenterdragoverdragleavedrop。关于拖放操作的更多细节,请参考DataTransfer17.7节。

 

readonly boolean defaultPrevented *

    如果在当前事件上调用defaultPrevented()则为true;否则为false。这是标准事件模型中一个新添加的属性,可能还不是所有浏览器都支持。(jQuery事件定义了一个功能类似于这个属性的isDefaultPrevented()方法。

 

readonly long detail

    与事件有关的一个数字细节。对clickmousedown以及mouseup来说,这个值是单击次数:单击为1,双击为2,三击为3,依次类推。在Firefox中,DOMMouseScroll事件使用这个属性来报告鼠标滚轮滚过的数量。

 

readonly unsigned short eventPhase *

    当前事件传播的阶段。值为上面定义的三个常量之一。IE事件不支持这个属性。

 

readonly boolean isTrusted *

    如果当前事件是由浏览器创建并分发的则为false;如果是由JavaScript代码创建并分发的人造事件则为false。这个属性在标准时间模型中还是一个相对较新的属性,可能不是所有浏览器都已实现。

 

readonly Element fromElement

    适用于IE中的mouseovermouseout事件,fromElement指向鼠标指针正在其中移动的对象。标准事件中对应的是relatedTarget属性。

 

readonly integer keyCode

    按下的键的实际的键码。这个属性对所有类型的键盘事件都可用。键码可能会与浏览器、操作系统或者依赖的键盘硬件相关。一般情况下,显示一个可打印字符的键的实际的键码就是那个字符的编码。非打印字符的功能键的键码可能有很多种变化,可参见17-8,其中包含一组常用的编码。这个属性尚未标准化,但所有浏览器(包括IE)都定义了它。

 

readonly boolean metaKey

    事件发生时Meta键是否按下。适用于鼠标和键盘事件,也包括IE事件。

 

readonly integer offsetX, offsetY

    适用于IE事件,这两个属性定义事件发生在事件源元素(参见srcElement)的坐标系统中的坐标。标准事件没有等效的属性。

 

readonly integer pageX, pageY

    这两属性不是标准属性,但广泛支持,类似于clientXclientY,然后它们使用文档坐标而不是窗口坐标。IE事件没有定义这两个属性,不过jQuery为所有浏览器模拟了它们。

 

readonly EventTarget relatedTarget *

    指向一个事件目标(通常是一个文档元素),该目标与事件的target节点关联。对mouseover事件来说,它是鼠标指针移动到目标上时离开的那个元素。对mouseout事件来说,它是鼠标离开目标时进入的元素。这个属性在IE事件中没有定义,不过jQuery事件中模拟了它。参见IE属性fromElementtoElement

 

boolean returnValue

    适用于IE事件,将这个属性设置为false将组织发生事件的源元素的默认动作。标准事件中使用preventDefault()方法代替。

 

readonly long screenX, screenY

    适用于鼠标事件,这两个属性定义了鼠标指针相对于用户的显示器的左上角的XY坐标。这个两个属性一般不是很有用,不过适用于所有鼠标事件类型,同时标准事件和IE事件都支持。

 

readonly boolean shiftKey

    事件发生时Shift键是否按下。适用于鼠标和按键事件,也适用于IE事件。

 

readonly EventTarget srcElement

    适用于IE事件,这个属性定义触发事件的对象。标准事件中使用target代替。

 

readonly EventTarget target *

    当前事件的目标对象——触发这个事件的对象。(所有可以作为事件目标的对象都实现EventTarget的方法)这个属性不适用于IE事件,不过jQuery事件模拟了它。参见srcElement

 

readonly unsigned long timeStamp *

    一个数字,可能为事件发生的时间或日期的时间戳,也可能是一个至少可用来比较两个事件发生的先后顺序的数字。许多浏览器返回的是一个可传入Date()构造函数的时间戳。但是,在Firefox4及更早的版本中,这个属性是另外类型的时间戳,比如自电脑启动以来的毫秒数。IE事件不支持这个属性,jQuey将这个属性设置为Date.getTime()返回的格式的时间戳。

 

Element toElement

    适用于IE中的mouseovermouseout事件,toElement指代鼠标指针正要移入的对象。标准事件中使用relatedTarget代替。

 

readonly string type *

   当前Event对象的事件名。这是时间处理程序注册的名字或事件处理程序属性去掉开头的“on”之后的名字,比如“click”、“load”或“submit”。这个属性适用于标准事件和IE事件。

 

readonly Window view

    生成事件的窗口(由于历史原因叫做“view”)。这个属性适用于所有标准的用户界面事件,比如鼠标和键盘事件。IE事件不支持此属性。

 

readonly integer wheelDelta

    适用于鼠标滚轮(mousewheel)事件,这个属性指明Y轴上已经滚动的数量。不同的浏览器中此属性的值也不同:细节参见17.6节。这是一个非标准属性,但是所有浏览器都支持,包括IE8及更早版本。

 

readonly integer wheelDeltaX

readonly integer wheelDeltaY

    适用于支持两个维度的鼠标滚轮的浏览器中的mousewheel事件,这两个属性指明XY方向的滚动数量。17.6节有关于如何解释这两个属性的说明。如果wheelDeltaY有定义,那么它将与wheelDelta属性的值相同。

 

readonly integer which

    这是个非标准的遗留属性,除IE外的浏览器都支持,jQuery中有对应的模拟。对鼠标事件来说,它和button属性一样:1表示左键、2表示中键、3表示右键。对键盘事件来说,它和keyCode的值一样。

 

 

方法

这些事件都是由Event类自己定义的,所以在所有标准Event对象上它们都可用。

 

void initEvent(string type, boolean bubbles, boolean cancelable)

这个方法初始化一个Event对象的typebubbles以及cancelable属性。向DocumentcreateEvent()方法传入字符串参数“Event”将创建一个新的事件对象。然后,在使用这个方法将其初始化之后,通过将它传入某个EventTargetdispatchEvent()方法将它分出去。其他标准事件属性(除typebubbles以及cancelable)将在分发时初始化。如果想创建、初始化然后分发一个更复杂的合成(synthetic)事件,必须向createEvent()传入一个不同的参数(比如“MouseEvent

”),然后用类似initMouseEvent()(本书没有介绍)的指定类型的初始化函数来初始化它。

 

void preventDefault()

告诉web浏览器不要执行与当前事件关联的默认操作,如果存在对应的默认操作的话。如果事件不是可取消的类型,这个方法将没有任何效果。这个方法不适用于IE事件对象,不过jQuery中有对应的模拟。在IE事件模型中,替代的方法是将returnValue属性设置为false

 

void stopImmediatePropagation()

类似于stopPropagation(),但除此之外,它还将阻止注册在这个文档元素上的所有其他事件处理程序。这个方法是新添加到标准事件模型中的,可能不是所有浏览器都实现它。它不适用于IE事件模型,不过jQuery中有对应的模拟。

 

void stopPropagation()

阻止事件在捕获、目标、冒泡阶段进行传播。调用这个方法后,同一个节点上同一个事件的其他事件处理程序将被调用,但这个事件将不会分发到其他节点上。这个方法在IE事件模型中不支持,不过jQuery中有对应模拟。在IE中,代替调用stopPropagation()的方法是将cancelBubble设置为true

 

 

转载于:https://my.oschina.net/u/2460907/blog/506505

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值