Convert native js event object to jquery event object

Question

I want to convert my own JavaScript event object to a jQuery event object.

This is actually a problem: I linked the event handler to the keyup documents via jQuery, and there are text fields on the page that the keyup event handler is keyup through inline JavaScript.

The problem is that the text field's event handler is triggered by the document's event handler, which also fires because the event is bubbling. I can change the event handler function associated with inline JavaScript, but not with the line itself.

What I'm looking for is a cross browser, a way to undo an event burst, so I wanted to convert it to a jQuery object.

Answer 1

If all you want to do is to prevent the event from being bubbled, which is easy without jQuery. Don't be afraid to go beyond the jQuery world. It is not as difficult as some people might believe.

 function stopEventPropagation(evt) { if (typeof evt.stopPropagation != "undefined") { evt.stopPropagation(); } else { evt.cancelBubble = true; } } // Example document.getElementById("yourInputId").onkeyup = function(evt) { evt = evt || window.event; stopEventPropagation(evt); }; 

Answer 2

Looking at jQuery code (I watched 1.7, but I think it is available before that), it is easy to create a jQuery event from your own event using:

 var jQueryEvent = jQuery.Event(event); 

Answer 3

You can remove onclick or any inline event handler attributes with jQuery right after the page loads, for example:

 $(document).ready(function () { $('#someInput').removeAttr('onclick'); }); 

Then attach event handlers to customize the behavior.