翻译了一段来自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.