I am assigning an event handler function to an element through the native browser onclick property:
document.getElementById('elmtid').onclick = function(event) { anotherFunction(event) };
When I’m in anotherFunction(event), I want to be able to use the event object like I would with the event object you get in jQuery through the .on() method. I want to do this because the jQuery event object has properties and methods such as .pageX, .pageY and .stopPropagation() that work across all browsers.
So my question is, after I’ve passed in the native browser event object into anotherFunction(), how can I turn it into a jQuery event? I tried $(event), but it didn’t work.
The obvious question here is: why don’t you just use jQuery .on, .bind, .click etc to assign your event handling functions? The answer: I’m building a page that has a huge table with lots of clickable things on it. Unfortunately this project requires that the page MUST render quickly in IE6 and IE7. Using .on et al in IE6 and IE7 creates DOM leaks and eats up memory very quickly (test for yourself with Drip: http://outofhanwell.com/ieleak/index.php?title=Main_Page). Setting onclick behavior via .onclick is the only option I have to render quickly in IE6 and IE7.
Too long for a comment… Because the documentation is a bit vague on this… (I’m looking at 1.7.1 in the following)
jQuery.Event(event, props):typeproperty to the event’stypeproperty.isDefaultPreventedby normalized calls to all the ways to check if default is prevented.originalEventto reference the event you passed in.propsobject argument.What you get is basically a new object with a few additional properties and a reference to the original event – no normalization other than
isDefaultPrevented.jQuery.event.fix(event):jQuery.Event()) and normalizes the properties mentioned here.ETA:
Actually, looking closer at the code,
jQuery.event.fix()should work – in the way described by @Beetroot-Beetroot. It’s all that jQuery does to create the jQuery event object in an event dispatch.