event.stopPropagation

  • Revision slug: DOM/event.stopPropagation
  • Revision title: event.stopPropagation
  • Revision id: 310717
  • Created:
  • Creator: ethertank
  • Is current revision? No
  • Comment

Revision Content

Summary

Prevents further propagation of the current event.

Syntax

event.stopPropagation();

Example

See Example 5: Event Propagation in the Examples chapter for a more detailed example of this method and event propagation in the DOM.

Notes

See the DOM specification for the explanation of event flow. (The DOM Level 3 Events draft has an illustration.)

preventDefault is a complementary method that can be used to prevent the default action of the event from happening.

Specification

DOM Level 3 Events: stopPropagation

Browser Compatibility

{{CompatibilityTable()}}

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support {{CompatVersionUnknown()}} {{CompatVersionUnknown()}} 9 {{CompatVersionUnknown()}} {{CompatVersionUnknown()}}
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support {{CompatVersionUnknown()}} {{CompatVersionUnknown()}} {{CompatUnknown()}} {{CompatVersionUnknown()}} {{CompatVersionUnknown()}}

Revision Source

<h2 id="Summary" name="Summary">Summary</h2>
<p>Prevents further propagation of the current event.</p>




<h2 id="Syntax" name="Syntax">Syntax</h2>
<pre class="syntaxbox"><em>event</em>.stopPropagation();</pre>




<h2 id="Example" name="Example">Example</h2>
<p>See Example 5: <a href="/ja/docs/Gecko_DOM_Reference/Examples#Example_5:_Event_Propagation" title="Gecko_DOM_Reference/Examples#Example_5:_Event_Propagation">Event Propagation</a> in the Examples chapter for a more detailed example of this method and event propagation in the DOM.</p>




<h2 id="Notes" name="Notes">Notes</h2>
<p>See the <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-flow-capture">DOM specification</a> for the explanation of event flow. (The <a class="external" href="http://www.w3.org/TR/DOM-Level-3-Events/#event-flow" title="http://www.w3.org/TR/DOM-Level-3-Events/#event-flow">DOM Level 3 Events draft</a> has an illustration.)</p>
<p><a href="/ja/docs/DOM/event.preventDefault" title="DOM/event.preventDefault">preventDefault</a> is a complementary method that can be used to prevent the default action of the event from happening.</p>




<h2 id="Specification" name="Specification">Specification</h2>
<p><a class="external" href="http://www.w3.org/TR/DOM-Level-3-Events/#events-event-type-stopPropagation">DOM Level 3 Events: stopPropagation</a></p>




<h2 id="Browser_Compatibility">Browser Compatibility</h2>
<p>{{CompatibilityTable()}}</p>
<div id="compat-desktop">
  <table class="compat-table">
    <tbody>
      <tr>
        <th>Feature</th>
        <th>Chrome</th>
        <th>Firefox (Gecko)</th>
        <th>Internet Explorer</th>
        <th>Opera</th>
        <th>Safari (WebKit)</th>
      </tr>
      <tr>
        <td>Basic support</td>
        <td>{{CompatVersionUnknown()}}</td>
        <td>{{CompatVersionUnknown()}}</td>
        <td>9</td>
        <td>{{CompatVersionUnknown()}}</td>
        <td>{{CompatVersionUnknown()}}</td>
      </tr>
    </tbody>
  </table>
</div>
<div id="compat-mobile">
  <table class="compat-table">
    <tbody>
      <tr>
        <th>Feature</th>
        <th>Android</th>
        <th>Firefox Mobile (Gecko)</th>
        <th>IE Phone</th>
        <th>Opera Mobile</th>
        <th>Safari Mobile</th>
      </tr>
      <tr>
        <td>Basic support</td>
        <td>{{CompatVersionUnknown()}}</td>
        <td>{{CompatVersionUnknown()}}</td>
        <td>{{CompatUnknown()}}</td>
        <td>{{CompatVersionUnknown()}}</td>
        <td>{{CompatVersionUnknown()}}</td>
      </tr>
    </tbody>
  </table>
</div>
Revert to this revision