event.stopImmediatePropagation() JQ Home  <<  Objects  <<  event.stopImmediatePropagation()

• <<    event.preventDefault()
• event.stopPropagation()     >>

Event stop immediate propagation method.

Description

The event.stopImmediatePropagation() Event object method when called, stops other event handlers from being called.

• When an event reaches an element, all handlers bound to that event type for the element are fired. If multiple handlers are registered for the element, they will always execute in the order in which they were bound. When all handlers have finished executing, the event continues along the normal event propagation path.
  • A handler can prevent the event from bubbling further up the document tree, thus preventing handlers on those elements from running, by calling the event.stopPropagation() method.
  • If other handlers are attached to the current element these will run however. This can be prevented by calling the event.stopImmediatePropagation() method.
  • To cancel any default action that the browser may have for this event, call the event.preventDefault() method.
  • Returning false from an event handler or calling an event handler with the false parameter, as an example ( $('aSelector').on('anEventType', false); ) will automatically call the event.stopPropagation() and event.preventDefault() methods on it.

Syntax

Parameters

None.

Return

None.

event.stopImmediatePropagation() Example Objects  <<  Top

When called, stops other event handlers from being called.

In the example below we show a new message in the 'div' element with an id of 'div11' whenever the mouse is clicked on this element stating immediate propogation stopped.

We are stopping other handlers from propogating so we will never see the output from the second handler.

$(function(){
  $('#div11').on('click', function(event) {
     event.stopImmediatePropagation();
     $('#div11').append('Has event.stopImmediatePropagation() been called on this event object? ' 
                       + event.isImmediatePropagationStopped() + '<br/>');
  });

  $('#div11').on('click', function(event) { // Following will not execute
     $('#div11').append('We will never see this text');
  });
});

Related Tutorials

jQuery Advanced Tutorials - Lesson 5 - The Event Object

• <<    event.preventDefault()
• event.stopPropagation()     >>