html5/spec Overview.html,1.5333,1.5334

Update of /sources/public/html5/spec
In directory hutz:/tmp/cvs-serv11810

Modified Files:
	Overview.html 
Log Message:
Define how event handler registration works to be compatible with IE and Firefox. (whatwg r6652)

Index: Overview.html
===================================================================
RCS file: /sources/public/html5/spec/Overview.html,v
retrieving revision 1.5333
retrieving revision 1.5334
diff -u -d -r1.5333 -r1.5334
--- Overview.html	6 Oct 2011 23:44:29 -0000	1.5333
+++ Overview.html	7 Oct 2011 21:45:06 -0000	1.5334
@@ -320,7 +320,7 @@
 
    <h1>HTML5</h1>
    <h2 class="no-num no-toc" id="a-vocabulary-and-associated-apis-for-html-and-xhtml">A vocabulary and associated APIs for HTML and XHTML</h2>
-   <h2 class="no-num no-toc" id="editor-s-draft-6-october-2011">Editor's Draft 6 October 2011</h2>
+   <h2 class="no-num no-toc" id="editor-s-draft-7-october-2011">Editor's Draft 7 October 2011</h2>
    <dl><dt>Latest Published Version:</dt>
     <dd><a href="http://www.w3.org/TR/html5/">http://www.w3.org/TR/html5/</a></dd>
     <dt>Latest Editor's Draft:</dt>
@@ -466,7 +466,7 @@
   Group</a> is the W3C working group responsible for this
   specification's progress along the W3C Recommendation
   track.
-  This specification is the 6 October 2011 Editor's Draft.
+  This specification is the 7 October 2011 Editor's Draft.
   </p><!-- UNDER NO CIRCUMSTANCES IS THE PRECEDING PARAGRAPH TO BE REMOVED OR EDITED WITHOUT TALKING TO IAN FIRST --><p>Work on this specification is also done at the <a href="http://www.whatwg.org/">WHATWG</a>. The W3C HTML working group
   actively pursues convergence with the WHATWG, as required by the <a href="http://www.w3.org/2007/03/HTML-WG-charter">W3C HTML working
   group charter</a>.</p><!-- UNDER NO CIRCUMSTANCES IS THE FOLLOWING PARAGRAPH TO BE REMOVED OR EDITED WITHOUT TALKING TO IAN FIRST --><p>This document was produced by a group operating under the <a href="http://www.w3.org/Consortium/Patent-Policy-20040205/">5
@@ -3150,9 +3150,9 @@
      <li><dfn id="event"><code>Event</code></dfn> interface</li>
      <li><dfn id="eventtarget"><code>EventTarget</code></dfn> interface</li>
      <li><dfn id="eventinit"><code>EventInit</code></dfn> dictionary type</li>
-     <li>The <dfn id="concept-event-type" title="concept-event-type">type</dfn> of an event</li>
-
      <li><dfn id="dom-event-target" title="dom-Event-target"><code>target</code></dfn> attribute</li>
+     <li>The <dfn id="concept-event-type" title="concept-event-type">type</dfn> of an event</li>
+     <li>The concept of an <dfn id="concept-event-listener" title="concept-event-listener">event listener</dfn> and the <a href="#concept-event-listener" title="concept-event-listener">event listeners</a> associated with an <code><a href="#eventtarget">EventTarget</a></code></li>
 
      <li>The <dfn id="document-s-character-encoding" title="document's character encoding">character encoding</dfn> and <dfn id="concept-document-media-type" title="concept-document-media-type">media type</dfn> of a <code><a href="#document">Document</a></code></li>
      <li>The distinction between <dfn id="xml-documents">XML documents</dfn> and <dfn id="html-documents">HTML documents</dfn></li>
@@ -50502,34 +50502,57 @@
   <a href="#browsing-context">browsing context</a>, the corresponding event handler is
   not changed.</p><div class="impl">
 
-  <hr><p>All <a href="#event-handlers">event handlers</a> on an object, whether an element
-  or some other object, and whether set to null or to a
-  <code><a href="#function">Function</a></code> object, must be registered as event listeners
-  on the object when it is created, as if the <code title="dom-EventTarget-addEventListener">addEventListener()</code>
-  method on the object's <code><a href="#eventtarget">EventTarget</a></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 id="event-handler-event-type">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><a href="#function">Function</a></code> object, and set to invoke the <code title="dom-function-call"><a href="#dom-function-call">call()</a></code> callback of the
-  <code><a href="#function">Function</a></code> object associated with the event handler
-  otherwise.</p>
+  <hr><p>When an <a href="#event-handlers" title="event handlers">event handler</a> <var title="">H</var> of an element or object <var title="">T</var>
+  implementing the <code><a href="#eventtarget">EventTarget</a></code> interface is first set to
+  a non-null <code><a href="#function">Function</a></code> object, the user agent must append
+  an <a href="#concept-event-listener" title="concept-event-listener">event listener</a> to the
+  list of <a href="#concept-event-listener" title="concept-event-listener">event listeners</a>
+  associated with <var title="">T</var> with <i>type</i> set to the
+  <dfn id="event-handler-event-type">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><a href="#function">Function</a></code> object and <a href="#concept-function-invoke" title="concept-Function-invoke">invokes the <code>Function</code>
+  object</a> associated with the <a href="#event-handlers" title="event handlers">event
+  handler</a> otherwise. <a href="#refsDOMCORE">[DOMCORE]</a></p>
 
-  </div><p class="note"><a href="#event-handlers">Event handlers</a> <span class="impl">therefore</span> always run before event listeners
-  attached using <code title="dom-EventTarget-addEventListener">addEventListener()</code>.<div class="impl">
+  <p class="note">The <i>listener</i> is emphatically <em>not</em> the
+  <a href="#event-handlers" title="event handlers">event handler</a> itself.</p>
 
-  <p class="note">The <var title="dom-event-listener">listener</var>
-  argument is emphatically <em>not</em> the <a href="#event-handlers" title="event
-  handlers">event handler</a> itself.</p>
+  <p class="note">This only happens the first time the <a href="#event-handlers" title="event handlers">event handler</a>'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>
+  before the first time the <a href="#event-handlers" title="event handlers">event
+  handler</a> was set to a non-null value, then the
+  <code><a href="#function">Function</a></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 <a href="#event-handlers" title="event handlers">event
+  handler</a> was set to a non-null value.</p>
+
+  </div><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>&lt;button id="test"&gt;Start Demo&lt;/button&gt;
+&lt;script&gt;
+ 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);
+&lt;/script&gt;</pre>
+
+  </div><div class="impl">
 
   <p class="note">The interfaces implemented by the event object do
   not influence whether an <a href="#event-handlers" title="event handlers">event
   handler</a> is triggered or not.</p>
 
   <p>When an <a href="#event-handlers" title="event handlers">event handler</a>'s
-  <code><a href="#function">Function</a></code> object is invoked, its <code title="dom-function-call"><a href="#dom-function-call">call()</a></code> callback must be invoked
+  <code><a href="#function">Function</a></code> object is <dfn id="concept-function-invoke" title="concept-Function-invoke">invoked</dfn>, its <code title="dom-function-call"><a href="#dom-function-call">call()</a></code> callback must be invoked
   with one argument, set to the <code><a href="#event">Event</a></code> object of the event
   in question.</p>

Received on Friday, 7 October 2011 21:45:12 UTC