Short URL: http://html5.org/r/6652
| SVN | Bug | Comment | Time (UTC) |
|---|---|---|---|
| 6652 | 13684 | 2011-10-07 21:41 |
Index: source
===================================================================
--- source (revision 6651)
+++ source (revision 6652)
@@ -2748,10 +2748,10 @@
<li><dfn><code>Event</code></dfn> interface</li>
<li><dfn><code>EventTarget</code></dfn> interface</li>
<li><dfn><code>EventInit</code></dfn> dictionary type</li>
+ <li><dfn title="dom-Event-target"><code>target</code></dfn> attribute</li>
<li>The <dfn title="concept-event-type">type</dfn> of an event</li>
+ <li>The concept of an <dfn title=concept-event-listener>event listener</dfn> and the <span title=concept-event-listener>event listeners</span> associated with an <code>EventTarget</code></li>
- <li><dfn title="dom-Event-target"><code>target</code></dfn> attribute</li>
-
<li>The <dfn title="document's character encoding">character encoding</dfn> and <dfn title="concept-document-media-type">media type</dfn> of a <code>Document</code></li>
<li>The distinction between <dfn>XML documents</dfn> and <dfn>HTML documents</dfn></li>
<li>The terms <dfn>quirks mode</dfn>, <dfn>limited-quirks mode</dfn>, and <dfn>no-quirks mode</dfn></li>
@@ -78807,44 +78807,68 @@
<hr>
- <p>All <span>event handlers</span> on an object, whether an element
- or some other object, and whether set to null or to a
- <code>Function</code> object, must be registered as event listeners
- on the object when it is created, as if the <code
+ <p>When an <span title="event handlers">event handler</span> <var
+ title="">H</var> of an element or object <var title="">T</var>
+ implementing the <code>EventTarget</code> interface is first set to
+ a non-null <code>Function</code> object, the user agent must append
+ an <span title="concept-event-listener">event listener</span> to the
+ list of <span title="concept-event-listener">event listeners</span>
+ associated with <var title="">T</var> with <i>type</i> set to the
+ <dfn>event handler event type</dfn> corresponding to <var
+ title="">H</var>, <i>capture</i> set to false, and <i>listener</i>
+ set to be an anonymous function that does nothing when the event
+ handler's value is not a <code>Function</code> object and <span
+ title="concept-Function-invoke">invokes the <code>Function</code>
+ object</span> associated with the <span title="event handlers">event
+ handler</span> otherwise. <a href="#refsDOMCORE">[DOMCORE]</a></p>
+
+ <p class="note">The <i>listener</i> is emphatically <em>not</em> the
+ <span title="event handlers">event handler</span> itself.</p>
+
+ <p class="note">This only happens the first time the <span
+ title="event handlers">event handler</span>'s value is set. Since
+ listeners are called in the order they were registered, the order of
+ event listeners for a particular event type will always be first the
+ event listeners registered with <code
title="dom-EventTarget-addEventListener">addEventListener()</code>
- method on the object's <code>EventTarget</code> interface had been
- invoked, with the event type (<var title="dom-event-type">type</var>
- argument) equal to the type corresponding to the event handler (the
- <dfn>event handler event type</dfn>), the listener set to be a
- target and bubbling phase listener (<var
- title="dom-event-useCapture">useCapture</var> argument set to
- false), and the event listener itself (<var
- title="dom-event-listener">listener</var> argument) set to do
- nothing while the event handler's value is not a
- <code>Function</code> object, and set to invoke the <code
- title="dom-function-call">call()</code> callback of the
- <code>Function</code> object associated with the event handler
- otherwise.</p>
+ before the first time the <span title="event handlers">event
+ handler</span> was set to a non-null value, then the
+ <code>Function</code> to which it is currently set, if any, and
+ finally the event listeners registered with <code
+ title="dom-EventTarget-addEventListener">addEventListener()</code>
+ <em>after</em> the first time the <span title="event handlers">event
+ handler</span> was set to a non-null value.</p>
</div>
- <p class="note"><span>Event handlers</span> <span
- class="impl">therefore</span> always run before event listeners
- attached using <code
- title="dom-EventTarget-addEventListener">addEventListener()</code>.</p>
+ <div class="example">
+ <p>This example demonstrates the order in which event listeners are
+ invoked. If the button in this example is clicked by the user, the
+ page will show four alerts, with the text "ONE", "TWO", "THREE",
+ and "FOUR" respectively.</p>
+
+ <pre><button id="test">Start Demo</button>
+<script>
+ var button = document.getElementById('test');
+ button.addEventListener('click', function () { alert('ONE') }, false);
+ button.setAttribute('onclick', "alert('NOT CALLED')"); // event handler listener is registered here
+ button.addEventListener('click', function () { alert('THREE') }, false);
+ button.onclick = function () { alert('TWO'); };
+ button.addEventListener('click', function () { alert('FOUR') }, false);
+</script></pre>
+
+ </div>
+
<div class="impl">
- <p class="note">The <var title="dom-event-listener">listener</var>
- argument is emphatically <em>not</em> the <span title="event
- handlers">event handler</span> itself.</p>
-
<p class="note">The interfaces implemented by the event object do
not influence whether an <span title="event handlers">event
handler</span> is triggered or not.</p>
<p>When an <span title="event handlers">event handler</span>'s
- <code>Function</code> object is invoked, its <code
+ <code>Function</code> object is <dfn
+ title="concept-Function-invoke">invoked</dfn>, its <code
title="dom-function-call">call()</code> callback must be invoked
with one argument, set to the <code>Event</code> object of the event
in question.</p>