api.jquery.com/entries/event.stopImmediatePropagation.xml at 7841fc03da32be8baa73a1b898f9ab04fccb091f · jquery/api.jquery.com · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<entry type='method' name="event.stopImmediatePropagation" return="">
  <signature>
    <added>1.3</added>
  </signature>
  <desc> Keeps the rest of the handlers from being executed and prevents the event from bubbling up the DOM tree.
  </desc>
  <longdesc><p>In addition to keeping any additional handlers on an element from being executed, this method also stops the bubbling by implicitly calling <code>event.stopPropagation()</code>. To simply prevent the event from bubbling to ancestor elements but allow other event handlers to execute on the same element, we can use <code><a href="http://api.jquery.com/event.stopPropagation">event.stopPropagation()</a></code> instead.</p>
    <p>Use <code><a href="http://api.jquery.com/event.isImmediatePropagationStopped">event.isImmediatePropagationStopped()</a></code> to know whether this method was ever called (on that event object).</p> </longdesc>

  <note id="propagation-for-live-or-delegate" type="additional"></note>


    <example>
        <desc>Prevents other event handlers from being called.</desc>
        <css><![CDATA[
p { height: 30px; width: 150px; background-color: #ccf; }
div {height: 30px; width: 150px; background-color: #cfc; }
]]></css>
        <code><![CDATA[
$("p").click(function(event){
  event.stopImmediatePropagation();
});
$("p").click(function(event){
  // This function won't be executed
  $(this).css("background-color", "#f00");
});
$("div").click(function(event) {
  // This function will be executed
    $(this).css("background-color", "#f00");
});]]></code>
        <html><![CDATA[<p>paragraph</p>
<div>division</div>]]></html>
    </example>
<category slug="events/event-object"/>
<category slug="version/1.3"/>
</entry>