CODEWITHSUNDEEP
javascripttriggersdom-events
cc young
cc young

Reputation: 20223

In a Javascript event, how to determine stopPropagation() has been called?

If e.preventDefault() is called, can see reflected in e.defaultPrevented method.

Is there a similar property for e.stopPropagation()? If not, how to determine?

Upvotes: 12

Views: 6672

Answers (3)

Josiah Ruddell
Josiah Ruddell

Reputation: 29831

I haven't looked through jQuery to see their method, but it seems you could override the stopPropagation method on the base Event object, set a flag, and then call the overridden method.

Something like:

var overriddenStop =  Event.prototype.stopPropagation;
Event.prototype.stopPropagation = function(){
    this.isPropagationStopped = true;
    overriddenStop.apply(this, arguments);
}

Upvotes: 10

Owen
Owen

Reputation: 640

In IE, you can check the property e.cancelBubble to check for native stops. Other browsers do not have this functionality.

However, you could just keep track of it yourself. Because of the nature of it, you wouldn't be able to check it anywhere, except in the same handler that stops the propagation itself (the event won't bubble up, more handlers won't get called), so I can't imagine a situation where it would be necessary. What are you trying to do?

Edit: I thought you were using jQuery at first. For those who are: You can use the e.isPropagationStopped() method, which will check if propagation has been stopped from jQuery. If propogation is stopped natively, this won't be able to tell.

Upvotes: 0

Šime Vidas
Šime Vidas

Reputation: 185933

No, there isn't.

I can tell, because jQuery's isPropagationStopped() method doesn't use any browser API internally, but instead implements this feature manually. (If there were such a feature in the browsers - built-in - jQuery would use it instead of doing it manually.)

So, in jQuery, a new event object will get this property (inherited):

isPropagationStopped: returnFalse

and then, when you invoke stopPropagation() on that event object, jQuery will manually alter this property:

stopPropagation: function() {
    this.isPropagationStopped = returnTrue;
    ...
}

returnFalse and returnTrue are functions which return false and true respectively.

Upvotes: 5

Related Questions