orginalEvent是什么,有什么用处,jquery不是万能的

翻译了一段来自stackoverflow的问答,原文在此

问题:

事件对象包括一个叫做originalEvent的属性,代表了浏览器自己产生的事件对象。jquery包裹了这个原生的事件对象,赋予了它jquery的方法和属性。但在某些情况下,需要去取得原始的这个事件对象,就要用到event.orginalEvent属性。尤其在移动端的触摸touch events事件时,尤为有用。

It’s also important to note that the event object contains a property called originalEvent, which is the event object that the browser itself created. jQuery wraps this native event object with some useful methods and properties, but in some instances, you’ll need to access the original event via event.originalEvent for instance. This is especially useful for touch events on mobile devices and tablets.



选取了第一位和第二位的回答。

如果浏览器是混杂模式的,而事件是一个触摸事件,那api会通过event.originalEvent暴露出来。

简单来说,event.originalEvent不一定等于该event, 主要取决于哪一类事件类型触发了handler和浏览器环境。

ps: 由浏览器决定的事件class称为原生事件,native event,比如window.Event,与jquery的事件类相对(比如$.Event)

楼下有人举了一个例子。想要拿到drop event 拖拽拉取的文件时,直接用会报错。用orginalEvent属性时就可以了。


var files = event.dataTransfer.files;    // Gives error: trying to get property of undefined


var files = event.originalEvent.dataTransfer.files;    // Works fine


这说明jquery没有包裹浏览器事件的全部API,比如file API, 所以要获得JQUERY event 下的这些属性和方法时,必须用originalEvent来获取事件对象。

event.originalEvent is usually just the native event (also described here).

However, if the browser is compatible, and the event was a touch event then that API will be exposed through event.originalEvent.

The short answer is that event.originalEvent is not always the same, it depends on which event type triggered the handler, and on the environment of the browser.

ps: The native event means the event class that defined by the browser (i.e. window.Event), in contrast to jQuery’s class which it defines (i.e. jQuery.Event/$.Event)

I have a case which I needed to use event.originalEvent the problem was trying to get an instance of a dropped file via drag and drop using the drop event, this is what happened

var files = event.dataTransfer.files; // Gives error: trying to get property of undefined

while writing

var files = event.originalEvent.dataTransfer.files; // Works fine

That means jQuery doesn’t wrap the native browser event with all its APIs like the File API in this example, so to get access to those excluded properties and functions from the jQuery event we must use event.originalEvent. Hope that helps someone.

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值