CODEWITHSUNDEEP
javascriptjqueryjquery-events
Shaheer
Shaheer

Reputation: 2147

Converting a native js event object to jQuery event object

I want to convert a native JavaScript event object to jQuery event object.

Actually this is the problem:
I have bound an event handler to documents keyup event via jQuery and there are some text boxes on the page with which a keyup event handler is bound via inline JavaScript.

The problem is when the text box's event handler is fired the document's event handler also gets fired because the event "bubbles up" I can modify the event handler function bound by inline JavaScript but not that line itself.

What I am looking for is a cross browser, a way to cancel the event bubbling that's why I wanted to convert it to a jQuery object.

Upvotes: 5

Views: 4887

Answers (3)

Aristoteles
Aristoteles

Reputation: 747

Looking to the code of jQuery (I looked at 1.7, but I think it is available before that as well) it is easy to create a jQuery Event from a native event using:

var jQueryEvent = jQuery.Event(event);

Upvotes: 9

Tim Down
Tim Down

Reputation: 324627

If all you want to do is prevent an event from bubbling, that's easy without jQuery. Don't be scared of stepping outside the world of jQuery. It's not as complicated as some people would have you 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);
};

Upvotes: 8

azAttis
azAttis

Reputation: 13

You can remove onclick or whatever inline eventhandler attributes with jQuery right after page load eg.: 

$(document).ready(function () {

  $('#someInput').removeAttr('onclick');

});

Then attach Your event handlers to customize behaviour.

Upvotes: 0

Related Questions