HTML Standard Tracker

Filter

File a bug

SVNBugCommentTime (UTC)
2282WF2: input and change events; activation behaviors for <input> element.2008-10-05 09:19
@@ -26270,20 +26270,66 @@ function AddCloud(data, x, y) { ... }</pre>
 <!-- <td class="yes"> Yes          Number -->
      <td class="yes"> Yes     <!-- Range -->
      <td class="no"> &middot; <!-- Checkbox -->
 <!-- <td class="no"> &middot;      Radio Button -->
      <td class="no"> &middot; <!-- File Upload -->
      <td class="no"> &middot; <!-- Submit Button -->
      <td class="no"> &middot; <!-- Image Button -->
      <td class="no"> &middot; <!-- Reset Button -->
 <!-- <td class="no"> &middot;      Button -->
 
+    <tr>
+     <th> <code title="event-input-input">input</code> event
+     <td class="no"> &middot; <!-- Hidden -->
+     <td class="yes"> Yes     <!-- Text -->
+<!-- <td class="yes"> Yes          E-mail -->
+<!-- <td class="yes"> Yes          URL -->
+     <td class="yes"> Yes     <!-- Password -->
+     <td class="yes"> Yes     <!-- Date and Time -->
+<!-- <td class="yes"> Yes          Date -->
+<!-- <td class="yes"> Yes          Month -->
+<!-- <td class="yes"> Yes          Week -->
+<!-- <td class="yes"> Yes          Time -->
+     <td class="yes"> Yes     <!-- Local Date and Time -->
+<!-- <td class="yes"> Yes          Number -->
+     <td class="yes"> Yes     <!-- Range -->
+     <td class="yes"> Yes     <!-- Checkbox -->
+<!-- <td class="yes"> Yes          Radio Button -->
+     <td class="no"> &middot; <!-- File Upload -->
+     <td class="no"> &middot; <!-- Submit Button -->
+     <td class="no"> &middot; <!-- Image Button -->
+     <td class="no"> &middot; <!-- Reset Button -->
+<!-- <td class="no"> &middot;      Button -->
+
+    <tr>
+     <th> <code title="event-input-change">change</code> event
+     <td class="no"> &middot; <!-- Hidden -->
+     <td class="yes"> Yes     <!-- Text -->
+<!-- <td class="yes"> Yes          E-mail -->
+<!-- <td class="yes"> Yes          URL -->
+     <td class="yes"> Yes     <!-- Password -->
+     <td class="yes"> Yes     <!-- Date and Time -->
+<!-- <td class="yes"> Yes          Date -->
+<!-- <td class="yes"> Yes          Month -->
+<!-- <td class="yes"> Yes          Week -->
+<!-- <td class="yes"> Yes          Time -->
+     <td class="yes"> Yes     <!-- Local Date and Time -->
+<!-- <td class="yes"> Yes          Number -->
+     <td class="yes"> Yes     <!-- Range -->
+     <td class="yes"> Yes     <!-- Checkbox -->
+<!-- <td class="yes"> Yes          Radio Button -->
+     <td class="yes"> Yes     <!-- File Upload -->
+     <td class="no"> &middot; <!-- Submit Button -->
+     <td class="no"> &middot; <!-- Image Button -->
+     <td class="no"> &middot; <!-- Reset Button -->
+<!-- <td class="no"> &middot; Button -->
+
   </table>
 
   <p>When an <code>input</code> element's <code
   title="attr-input-type">type</code> attribute changes state, and
   when the element is first created, the element's rendering and
   behaviour must change to the new state's accordingly and the
   <dfn>value sanitization algorithm</dfn>, if one is defined for the
   <code title="attr-input-type">type</code> attribute's new state,
   must be invoked.</p>
 
@@ -26449,23 +26495,20 @@ function AddCloud(data, x, y) { ... }</pre>
 
 
 
   <h5>States of the <code title="attr-input-type">type</code> attribute</h5>
 
   <!-- XXX for things that say "express it as a valid foo", make sure
   that valid foo is unambiguous, and if not, define a canonical
   serialisation. e.g. should it be 2008-01-01T00:00 or
   2008-01-01t00:00? should it be 1e2 or 100? -->
 
-  <!-- XXX for each of these, need to say when to fire oninput and
-  onchange -->
-
 
 
   <h6><dfn title="attr-input-type-hidden">Hidden</dfn> state</h6>
 
   <p>When an <code>input</code> element's <code
   title="attr-input-type">type</code> attribute is in the <span
   title="attr-input-type-hidden">Hidden</span> state, the rules in
   this section apply.</p>
 
   <p>The <code>input</code> element represents a value that is not
@@ -26511,20 +26554,23 @@ function AddCloud(data, x, y) { ... }</pre>
   <p>The following DOM attributes and methods do not apply to the
   element:
   <code class="no-backref" title="dom-input-checked">checked</code>,
   <code class="no-backref" title="dom-input-list">list</code>,
   <code class="no-backref" title="dom-input-selectedOption">selectedOption</code>,
   <code class="no-backref" title="dom-input-valueAsDate">valueAsDate</code>, and
   <code class="no-backref" title="dom-input-valueAsNumber">valueAsNumber</code> DOM attributes
   <code class="no-backref" title="dom-input-stepUp">stepUp()</code>, and
   <code class="no-backref" title="dom-input-stepDown">stepDown()</code> methods.</p>
 
+  <p>The <code class="no-backref"
+  title="event-input-input">input</code> and <code class="no-backref"
+  title="event-input-change">change</code> events do not fire.</p>
 
 
   <h6><dfn title="attr-input-type-text">Text</dfn> state</h6>
 
   <p>When an <code>input</code> element's <code
   title="attr-input-type">type</code> attribute is in the <span
   title="attr-input-type-text">Text</span> state, the rules in this
   section apply.</p>
 
   <p>The <code>input</code> element represents a one line plain text
@@ -26549,20 +26595,23 @@ function AddCloud(data, x, y) { ... }</pre>
   <code title="attr-input-readonly">readonly</code>,
   <code title="attr-input-required">required</code>, and
   <code title="attr-input-size">size</code> content attributes;
   <code title="dom-input-list">list</code>,
   <code title="dom-input-selectedOption">selectedOption</code>, and
   <code title="dom-input-value">value</code> DOM attributes.
 
   <p>The <code title="dom-input-value">value</code> DOM attribute is
   in mode <span title="dom-input-value-value">value</span>.</p>
 
+  <p>The <code title="event-input-input">input</code> and <code
+  title="event-input-change">change</code> events apply.</p>
+
   <p>The following content attributes must not be specified and do not
   apply to the element:
   <code class="no-backref" title="attr-input-accept">accept</code>,
   <code class="no-backref" title="attr-fs-action">action</code>,
   <code class="no-backref" title="attr-input-alt">alt</code>,
   <code class="no-backref" title="attr-input-checked">checked</code>,
   <code class="no-backref" title="attr-fs-enctype">enctype</code>,
   <code class="no-backref" title="attr-input-max">max</code>,
   <code class="no-backref" title="attr-fs-method">method</code>,
   <code class="no-backref" title="attr-input-min">min</code>,
@@ -26623,20 +26672,23 @@ function AddCloud(data, x, y) { ... }</pre>
   <code title="attr-input-readonly">readonly</code>,
   <code title="attr-input-required">required</code>, and
   <code title="attr-input-size">size</code> content attributes;
   <code title="dom-input-list">list</code>,
   <code title="dom-input-selectedOption">selectedOption</code>, and
   <code title="dom-input-value">value</code> DOM attributes.
 
   <p>The <code title="dom-input-value">value</code> DOM attribute is
   in mode <span title="dom-input-value-value">value</span>.</p>
 
+  <p>The <code title="event-input-input">input</code> and <code
+  title="event-input-change">change</code> events apply.</p>
+
   <p>The following content attributes must not be specified and do not
   apply to the element:
   <code class="no-backref" title="attr-input-accept">accept</code>,
   <code class="no-backref" title="attr-fs-action">action</code>,
   <code class="no-backref" title="attr-input-alt">alt</code>,
   <code class="no-backref" title="attr-input-checked">checked</code>,
   <code class="no-backref" title="attr-fs-enctype">enctype</code>,
   <code class="no-backref" title="attr-input-max">max</code>,
   <code class="no-backref" title="attr-fs-method">method</code>,
   <code class="no-backref" title="attr-input-min">min</code>,
@@ -26693,20 +26745,23 @@ function AddCloud(data, x, y) { ... }</pre>
   <code title="attr-input-readonly">readonly</code>,
   <code title="attr-input-required">required</code>, and
   <code title="attr-input-size">size</code> content attributes;
   <code title="dom-input-list">list</code>,
   <code title="dom-input-selectedOption">selectedOption</code>, and
   <code title="dom-input-value">value</code> DOM attributes.
 
   <p>The <code title="dom-input-value">value</code> DOM attribute is
   in mode <span title="dom-input-value-value">value</span>.</p>
 
+  <p>The <code title="event-input-input">input</code> and <code
+  title="event-input-change">change</code> events apply.</p>
+
   <p>The following content attributes must not be specified and do not
   apply to the element:
   <code class="no-backref" title="attr-input-accept">accept</code>,
   <code class="no-backref" title="attr-fs-action">action</code>,
   <code class="no-backref" title="attr-input-alt">alt</code>,
   <code class="no-backref" title="attr-input-checked">checked</code>,
   <code class="no-backref" title="attr-fs-enctype">enctype</code>,
   <code class="no-backref" title="attr-input-max">max</code>,
   <code class="no-backref" title="attr-fs-method">method</code>,
   <code class="no-backref" title="attr-input-min">min</code>,
@@ -26748,20 +26803,23 @@ function AddCloud(data, x, y) { ... }</pre>
   <p>The following common <code>input</code> element content
   attributes and DOM attributes apply to the element:
   <code title="attr-input-autocomplete">autocomplete</code>,
   <code title="attr-input-maxlength">maxlength</code>,
   <code title="attr-input-pattern">pattern</code>,
   <code title="attr-input-readonly">readonly</code>,
   <code title="attr-input-required">required</code>, and
   <code title="attr-input-size">size</code> content attributes;
   <code title="attr-input-value">value</code> DOM attribute.</p>
 
+  <p>The <code title="event-input-input">input</code> and <code
+  title="event-input-change">change</code> events apply.</p>
+
   <p>The following content attributes must not be specified and do not
   apply to the element:
   <code class="no-backref" title="attr-input-accept">accept</code>,
   <code class="no-backref" title="attr-fs-action">action</code>,
   <code class="no-backref" title="attr-input-alt">alt</code>,
   <code class="no-backref" title="attr-input-checked">checked</code>,
   <code class="no-backref" title="attr-fs-enctype">enctype</code>,
   <code class="no-backref" title="attr-input-list">list</code>,
   <code class="no-backref" title="attr-input-max">max</code>,
   <code class="no-backref" title="attr-fs-method">method</code>,
@@ -26888,20 +26946,23 @@ function AddCloud(data, x, y) { ... }</pre>
   <code title="dom-input-value">value</code>,
   <code title="dom-input-valueAsDate">valueAsDate</code>,
   <code title="dom-input-valueAsNumber">valueAsNumber</code>, and
   <code title="dom-input-selectedOption">selectedOption</code> DOM attributes;
   <code title="dom-input-stepUp">stepUp()</code>, and
   <code title="dom-input-stepDown">stepDown()</code> methods.</p>
 
   <p>The <code title="dom-input-value">value</code> DOM attribute is
   in mode <span title="dom-input-value-value">value</span>.</p>
 
+  <p>The <code title="event-input-input">input</code> and <code
+  title="event-input-change">change</code> events apply.</p>
+
   <p>The following content attributes must not be specified and do not
   apply to the element:
   <code class="no-backref" title="attr-input-accept">accept</code>,
   <code class="no-backref" title="attr-input-alt">alt</code>,
   <code class="no-backref" title="attr-fs-action">action</code>,
   <code class="no-backref" title="attr-input-checked">checked</code>,
   <code class="no-backref" title="attr-fs-enctype">enctype</code>,
   <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
   <code class="no-backref" title="attr-fs-method">method</code>,
   <code class="no-backref" title="attr-input-pattern">pattern</code>,
@@ -27017,20 +27078,23 @@ function AddCloud(data, x, y) { ... }</pre>
   <code title="dom-input-value">value</code>,
   <code title="dom-input-valueAsDate">valueAsDate</code>,
   <code title="dom-input-valueAsNumber">valueAsNumber</code>, and
   <code title="dom-input-selectedOption">selectedOption</code> DOM attributes;
   <code title="dom-input-stepUp">stepUp()</code>, and
   <code title="dom-input-stepDown">stepDown()</code> methods.</p>
 
   <p>The <code title="dom-input-value">value</code> DOM attribute is
   in mode <span title="dom-input-value-value">value</span>.</p>
 
+  <p>The <code title="event-input-input">input</code> and <code
+  title="event-input-change">change</code> events apply.</p>
+
   <p>The following content attributes must not be specified and do not
   apply to the element:
   <code class="no-backref" title="attr-input-accept">accept</code>,
   <code class="no-backref" title="attr-fs-action">action</code>,
   <code class="no-backref" title="attr-input-alt">alt</code>,
   <code class="no-backref" title="attr-input-checked">checked</code>,
   <code class="no-backref" title="attr-fs-enctype">enctype</code>,
   <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
   <code class="no-backref" title="attr-fs-method">method</code>,
   <code class="no-backref" title="attr-input-pattern">pattern</code>,
@@ -27148,20 +27212,23 @@ function AddCloud(data, x, y) { ... }</pre>
   <code title="dom-input-value">value</code>,
   <code title="dom-input-valueAsDate">valueAsDate</code>,
   <code title="dom-input-valueAsNumber">valueAsNumber</code>, and
   <code title="dom-input-selectedOption">selectedOption</code> DOM attributes;
   <code title="dom-input-stepUp">stepUp()</code>, and
   <code title="dom-input-stepDown">stepDown()</code> methods.</p>
 
   <p>The <code title="dom-input-value">value</code> DOM attribute is
   in mode <span title="dom-input-value-value">value</span>.</p>
 
+  <p>The <code title="event-input-input">input</code> and <code
+  title="event-input-change">change</code> events apply.</p>
+
   <p>The following content attributes must not be specified and do not
   apply to the element:
   <code class="no-backref" title="attr-input-accept">accept</code>,
   <code class="no-backref" title="attr-fs-action">action</code>,
   <code class="no-backref" title="attr-input-alt">alt</code>,
   <code class="no-backref" title="attr-input-checked">checked</code>,
   <code class="no-backref" title="attr-fs-enctype">enctype</code>,
   <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
   <code class="no-backref" title="attr-fs-method">method</code>,
   <code class="no-backref" title="attr-input-pattern">pattern</code>,
@@ -27278,20 +27345,23 @@ function AddCloud(data, x, y) { ... }</pre>
   <code title="dom-input-value">value</code>,
   <code title="dom-input-valueAsDate">valueAsDate</code>,
   <code title="dom-input-valueAsNumber">valueAsNumber</code>, and
   <code title="dom-input-selectedOption">selectedOption</code> DOM attributes;
   <code title="dom-input-stepUp">stepUp()</code>, and
   <code title="dom-input-stepDown">stepDown()</code> methods.</p>
 
   <p>The <code title="dom-input-value">value</code> DOM attribute is
   in mode <span title="dom-input-value-value">value</span>.</p>
 
+  <p>The <code title="event-input-input">input</code> and <code
+  title="event-input-change">change</code> events apply.</p>
+
   <p>The following content attributes must not be specified and do not
   apply to the element:
   <code class="no-backref" title="attr-input-accept">accept</code>,
   <code class="no-backref" title="attr-fs-action">action</code>,
   <code class="no-backref" title="attr-input-alt">alt</code>,
   <code class="no-backref" title="attr-input-checked">checked</code>,
   <code class="no-backref" title="attr-fs-enctype">enctype</code>,
   <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
   <code class="no-backref" title="attr-fs-method">method</code>,
   <code class="no-backref" title="attr-input-pattern">pattern</code>,
@@ -27403,20 +27473,23 @@ function AddCloud(data, x, y) { ... }</pre>
   <code title="dom-input-value">value</code>,
   <code title="dom-input-valueAsDate">valueAsDate</code>,
   <code title="dom-input-valueAsNumber">valueAsNumber</code>, and
   <code title="dom-input-selectedOption">selectedOption</code> DOM attributes;
   <code title="dom-input-stepUp">stepUp()</code>, and
   <code title="dom-input-stepDown">stepDown()</code> methods.</p>
 
   <p>The <code title="dom-input-value">value</code> DOM attribute is
   in mode <span title="dom-input-value-value">value</span>.</p>
 
+  <p>The <code title="event-input-input">input</code> and <code
+  title="event-input-change">change</code> events apply.</p>
+
   <p>The following content attributes must not be specified and do not
   apply to the element:
   <code class="no-backref" title="attr-input-accept">accept</code>,
   <code class="no-backref" title="attr-fs-action">action</code>,
   <code class="no-backref" title="attr-input-alt">alt</code>,
   <code class="no-backref" title="attr-input-checked">checked</code>,
   <code class="no-backref" title="attr-fs-enctype">enctype</code>,
   <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
   <code class="no-backref" title="attr-fs-method">method</code>,
   <code class="no-backref" title="attr-input-pattern">pattern</code>,
@@ -27515,20 +27588,23 @@ function AddCloud(data, x, y) { ... }</pre>
   <code title="dom-input-list">list</code>,
   <code title="dom-input-value">value</code>,
   <code title="dom-input-valueAsNumber">valueAsNumber</code>, and
   <code title="dom-input-selectedOption">selectedOption</code> DOM attributes;
   <code title="dom-input-stepUp">stepUp()</code>, and
   <code title="dom-input-stepDown">stepDown()</code> methods.</p>
 
   <p>The <code title="dom-input-value">value</code> DOM attribute is
   in mode <span title="dom-input-value-value">value</span>.</p>
 
+  <p>The <code title="event-input-input">input</code> and <code
+  title="event-input-change">change</code> events apply.</p>
+
   <p>The following content attributes must not be specified and do not
   apply to the element:
   <code class="no-backref" title="attr-input-accept">accept</code>,
   <code class="no-backref" title="attr-fs-action">action</code>,
   <code class="no-backref" title="attr-input-alt">alt</code>,
   <code class="no-backref" title="attr-input-checked">checked</code>,
   <code class="no-backref" title="attr-fs-enctype">enctype</code>,
   <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
   <code class="no-backref" title="attr-fs-method">method</code>,
   <code class="no-backref" title="attr-input-pattern">pattern</code>,
@@ -27616,20 +27692,23 @@ function AddCloud(data, x, y) { ... }</pre>
   <code title="dom-input-list">list</code>,
   <code title="dom-input-value">value</code>,
   <code title="dom-input-valueAsNumber">valueAsNumber</code>, and
   <code title="dom-input-selectedOption">selectedOption</code> DOM attributes;
   <code title="dom-input-stepUp">stepUp()</code>, and
   <code title="dom-input-stepDown">stepDown()</code> methods.</p>
 
   <p>The <code title="dom-input-value">value</code> DOM attribute is
   in mode <span title="dom-input-value-value">value</span>.</p>
 
+  <p>The <code title="event-input-input">input</code> and <code
+  title="event-input-change">change</code> events apply.</p>
+
   <p>The following content attributes must not be specified and do not
   apply to the element:
   <code class="no-backref" title="attr-input-accept">accept</code>,
   <code class="no-backref" title="attr-fs-action">action</code>,
   <code class="no-backref" title="attr-input-alt">alt</code>,
   <code class="no-backref" title="attr-input-checked">checked</code>,
   <code class="no-backref" title="attr-fs-enctype">enctype</code>,
   <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
   <code class="no-backref" title="attr-fs-method">method</code>,
   <code class="no-backref" title="attr-input-pattern">pattern</code>,
@@ -27755,20 +27834,23 @@ function AddCloud(data, x, y) { ... }</pre>
   <code title="dom-input-list">list</code>,
   <code title="dom-input-value">value</code>,
   <code title="dom-input-valueAsNumber">valueAsNumber</code>, and
   <code title="dom-input-selectedOption">selectedOption</code> DOM attributes;
   <code title="dom-input-stepUp">stepUp()</code>, and
   <code title="dom-input-stepDown">stepDown()</code> methods.</p>
 
   <p>The <code title="dom-input-value">value</code> DOM attribute is
   in mode <span title="dom-input-value-value">value</span>.</p>
 
+  <p>The <code title="event-input-input">input</code> and <code
+  title="event-input-change">change</code> events apply.</p>
+
   <p>The following content attributes must not be specified and do not
   apply to the element:
   <code class="no-backref" title="attr-input-accept">accept</code>,
   <code class="no-backref" title="attr-fs-action">action</code>,
   <code class="no-backref" title="attr-input-alt">alt</code>,
   <code class="no-backref" title="attr-input-checked">checked</code>,
   <code class="no-backref" title="attr-fs-enctype">enctype</code>,
   <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
   <code class="no-backref" title="attr-fs-method">method</code>,
   <code class="no-backref" title="attr-input-pattern">pattern</code>,
@@ -27792,40 +27874,47 @@ function AddCloud(data, x, y) { ... }</pre>
   this section apply.</p>
 
   <p>The <code>input</code> element represents a two-state control
   that represents the element's <span
   title="concept-fe-checked">checkedness</span> state. If the
   element's <span title="concept-fe-checked">checkedness</span> state
   is true, the control represents a positive selection, and if it is
   false, a negative selection.</p>
 
   <p>If the element is <i title="concept-input-mutable">mutable</i>,
-  the user should allow the user to toggle the <span
-  title="concept-fe-checked">checkedness</span> state.</p>
+  then: The <span>pre-click activation steps</span> consist of setting
+  the element's <span title="concept-fe-checked">checkedness</span> to
+  its opposite value (i.e. true if it is false, false if it is
+  true). The <span>canceled activation steps</span> consist of setting
+  the <span title="concept-fe-checked">checkedness</span> back to the
+  value it had before the <span>pre-click activation steps</span> were
+  run. The <span>activation behavior</span> is to <span>fire a simple
+  event</span> called <code title="event-change">change</code> at the
+  element.</p>
 
   <p><strong>Constraint validation:</strong> If the element is <i
   title="concept-input-required">required</i> and its <span
   title="concept-fe-checkedness">checkedness</span> is false, then the
   element is <span>suffering from being missing</span>.</p>
 
-  <!-- XXX event timing; activation behavior -->
-
   <p>The following common <code>input</code> element content
   attributes and DOM attributes apply to the element:
   <code title="attr-input-checked">checked</code>, and
   <code title="attr-input-required">required</code> content attributes;
   <code title="dom-input-checked">checked</code> and
   <code title="dom-input-value">value</code> DOM attributes.</p>
 
   <p>The <code title="dom-input-value">value</code> DOM attribute is
   in mode <span title="dom-input-value-default-on">default/on</span>.</p>
 
+  <p>The <code title="event-input-change">change</code> event applies.</p>
+
   <p>The following content attributes must not be specified and do not
   apply to the element:
   <code class="no-backref" title="attr-input-accept">accept</code>,
   <code class="no-backref" title="attr-fs-action">action</code>,
   <code class="no-backref" title="attr-input-alt">alt</code>,
   <code class="no-backref" title="attr-input-autocomplete">autocomplete</code>,
   <code class="no-backref" title="attr-fs-enctype">enctype</code>,
   <code class="no-backref" title="attr-input-list">list</code>,
   <code class="no-backref" title="attr-input-max">max</code>,
   <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
@@ -27839,20 +27928,23 @@ function AddCloud(data, x, y) { ... }</pre>
   <code class="no-backref" title="attr-fs-target">target</code>.</p>
 
   <p>The following DOM attributes and methods do not apply to the element:
   <code class="no-backref" title="dom-input-list">list</code>,
   <code class="no-backref" title="dom-input-selectedOption">selectedOption</code>,
   <code class="no-backref" title="dom-input-valueAsDate">valueAsDate</code> and
   <code class="no-backref" title="dom-input-valueAsNumber">valueAsNumber</code> DOM attributes;
   <code class="no-backref" title="dom-input-stepDown">stepDown()</code> and
   <code class="no-backref" title="dom-input-stepUp">stepUp()</code> methods.</p>
 
+  <p>The <code title="event-input-input">input</code> event does not
+  apply.</p>
+
 
 
   <h6><dfn title="attr-input-type-radio">Radio Button</dfn> state</h6>
 
   <p>When an <code>input</code> element's <code
   title="attr-input-type">type</code> attribute is in the <span
   title="attr-input-type-radio">Radio Button</span> state, the rules
   in this section apply.</p>
 
   <p>The <code>input</code> element represents a control that, when
@@ -27884,65 +27976,69 @@ function AddCloud(data, x, y) { ... }</pre>
    title="attr-fe-name">name</code> attribute is a
    <span>compatibility caseless</span> match for the value of <var
    title="">b</var>'s <code title="attr-fe-name">name</code>
    attribute.</li>
 
   </ul>
 
   <p>A document must not contain an <code>input</code> element whose
   <i>radio button group</i> contains only that element.</p>
 
-  <p>If the element is <i title="concept-input-mutable">mutable</i>,
-  the user should allow the user to set the <span
-  title="concept-fe-checked">checkedness</span> state of the
-  element to true.</p>
-
   <p>When any of the following events occur, if the element's <span
   title="concept-fe-checked">checkedness</span> state is true after
   the event, the <span
   title="concept-fe-checked">checkedness</span> state of all the
   other elements in the same <i>radio button group</i> must be set to
-  false:</p> <!-- XXX event firing order and timing -->
+  false:</p>
 
   <ul>
 
    <li>The element's <span
    title="concept-fe-checked">checkedness</span> state is set to
    true (for whatever reason).</li>
 
    <li>The element's <code title="attr-fe-name">name</code>
    attribute is added, removed, or changes value<!-- XXX setting to
    the same value? -->.</li>
 
    <li>The element's <span>form owner</span> changes.</li>
 
   </ul>
 
+  <p>If the element is <i title="concept-input-mutable">mutable</i>,
+  then: The <span>pre-click activation steps</span> consist of setting
+  the element's <span title="concept-fe-checked">checkedness</span> to
+  true. The <span>canceled activation steps</span> consist of setting
+  the element's <span title="concept-fe-checked">checkedness</span> to
+  false. The <span>activation behavior</span> is to <span>fire a
+  simple event</span> called <code title="event-change">change</code>
+  at the element.</p>
+
   <p><strong>Constraint validation:</strong> If the element is <i
   title="concept-input-required">required</i> and all of the
   <code>input</code> elements in the <i>radio button group</i> have a
   <span title="concept-fe-checkedness">checkedness</span> that is
   false, then the element is <span>suffering from being
   missing</span>.</p>
 
-  <!-- XXX event timing; activation behavior -->
-
   <p>The following common <code>input</code> element content
   attributes and DOM attributes apply to the element:
   <code title="attr-input-checked">checked</code> and
   <code title="attr-input-required">required</code> content attributes;
   <code title="dom-input-checked">checked</code> and
   <code title="dom-input-value">value</code> DOM attributes.</p>
 
   <p>The <code title="dom-input-value">value</code> DOM attribute is
   in mode <span title="dom-input-value-default-on">default/on</span>.</p>
 
+  <p>The <code title="event-input-change">change</code> event applies.</p>
+
   <p>The following content attributes must not be specified and do not
   apply to the element:
   <code class="no-backref" title="attr-input-accept">accept</code>,
   <code class="no-backref" title="attr-fs-action">action</code>,
   <code class="no-backref" title="attr-input-alt">alt</code>,
   <code class="no-backref" title="attr-input-autocomplete">autocomplete</code>,
   <code class="no-backref" title="attr-fs-enctype">enctype</code>,
   <code class="no-backref" title="attr-input-list">list</code>,
   <code class="no-backref" title="attr-input-max">max</code>,
   <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
@@ -27956,20 +28052,23 @@ function AddCloud(data, x, y) { ... }</pre>
   <code class="no-backref" title="attr-fs-target">target</code>.</p>
 
   <p>The following DOM attributes and methods do not apply to the element:
   <code class="no-backref" title="dom-input-list">list</code>,
   <code class="no-backref" title="dom-input-selectedOption">selectedOption</code>,
   <code class="no-backref" title="dom-input-valueAsDate">valueAsDate</code> and
   <code class="no-backref" title="dom-input-valueAsNumber">valueAsNumber</code> DOM attributes;
   <code class="no-backref" title="dom-input-stepDown">stepDown()</code> and
   <code class="no-backref" title="dom-input-stepUp">stepUp()</code> methods.</p>
 
+  <p>The <code title="event-input-input">input</code> event does not
+  apply.</p>
+
 
 
 
   <h6><dfn title="attr-input-type-file">File Upload</dfn> state</h6>
 
   <p>When an <code>input</code> element's <code
   title="attr-input-type">type</code> attribute is in the <span
   title="attr-input-type-file">File Upload</span> state, the rules in this
   section apply.</p>
 
@@ -28032,20 +28131,22 @@ function AddCloud(data, x, y) { ... }</pre>
   <p>User agents should prevent the user from selecting files that are
   not accepted by one (or more) of these tokens.</p>
 
   <hr>
 
   <p>The following common <code>input</code> element content
   attributes apply to the element:
   <code title="attr-input-accept">accept</code> and
   <code title="attr-input-required">required</code>.</p>
 
+  <p>The <code title="event-input-change">change</code> event applies.</p>
+
   <p>The following content attributes must not be specified and do not
   apply to the element:
   <code class="no-backref" title="attr-fs-action">action</code>,
   <code class="no-backref" title="attr-input-alt">alt</code>,
   <code class="no-backref" title="attr-input-autocomplete">autocomplete</code>,
   <code class="no-backref" title="attr-input-checked">checked</code>,
   <code class="no-backref" title="attr-fs-enctype">enctype</code>,
   <code class="no-backref" title="attr-input-list">list</code>,
   <code class="no-backref" title="attr-input-max">max</code>,
   <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
@@ -28064,45 +28165,47 @@ function AddCloud(data, x, y) { ... }</pre>
   <p>The following DOM attributes and methods do not apply to the element:
   <code class="no-backref" title="dom-input-checked">checked</code>,
   <code class="no-backref" title="dom-input-list">list</code>,
   <code class="no-backref" title="dom-input-selectedOption">selectedOption</code>,
   <code class="no-backref" title="dom-input-value">value</code>,
   <code class="no-backref" title="dom-input-valueAsDate">valueAsDate</code> and
   <code class="no-backref" title="dom-input-valueAsNumber">valueAsNumber</code> DOM attributes;
   <code class="no-backref" title="dom-input-stepDown">stepDown()</code> and
   <code class="no-backref" title="dom-input-stepUp">stepUp()</code> methods.</p>
 
+  <p>The <code title="event-input-input">input</code> event does not
+  apply.</p>
+
 
 
 
   <h6><dfn title="attr-input-type-submit">Submit Button</dfn> state</h6>
 
   <p>When an <code>input</code> element's <code
   title="attr-input-type">type</code> attribute is in the <span
   title="attr-input-type-submit">Submit Button</span> state, the rules
   in this section apply.</p>
 
   <p>The <code>input</code> element represents a button that, when
   activated, submits the form. If the element has a <code
   title="attr-input-value">value</code> attribute, the button's label
   must be the value of that attribute; otherwise, it must be an
   implementation-defined string that means "Submit" or some such.</p>
 
   <p>If the element is <i title="concept-input-mutable">mutable</i>,
   the user should allow the user to activate the element.</p>
 
-  <!-- XXX event timing; activation behavior -->
-
-  <p>When the element is activated, if the element has a <span>form
-  owner</span>, the element must <span
+  <p>The element's <span>activation behavior</span>, if the element
+  has a <span>form owner</span>, is to <span
   title="concept-form-submit">submit</span> the <span>form
-  owner</span> from the <code>input</code> element.</p>
+  owner</span> from the <code>input</code> element; otherwise, it is
+  to do nothing.</p>
 
   <p>The <code title="attr-fs-action">action</code>, <code
   title="attr-fs-enctype">enctype</code>, <code
   title="attr-fs-method">method</code>, and <code
   title="attr-fs-target">target</code> attributes control the form
   submission.</p>
 
   <p>The following common <code>input</code> element content
   attributes and DOM attributes apply to the element:
   <code title="attr-fs-action">action</code>,
@@ -28133,20 +28236,24 @@ function AddCloud(data, x, y) { ... }</pre>
 
   <p>The following DOM attributes and methods do not apply to the element:
   <code class="no-backref" title="dom-input-checked">checked</code>,
   <code class="no-backref" title="dom-input-list">list</code>,
   <code class="no-backref" title="dom-input-selectedOption">selectedOption</code>,
   <code class="no-backref" title="dom-input-valueAsDate">valueAsDate</code> and
   <code class="no-backref" title="dom-input-valueAsNumber">valueAsNumber</code> DOM attributes;
   <code class="no-backref" title="dom-input-stepDown">stepDown()</code> and
   <code class="no-backref" title="dom-input-stepUp">stepUp()</code> methods.</p>
 
+  <p>The <code class="no-backref"
+  title="event-input-input">input</code> and <code class="no-backref"
+  title="event-input-change">change</code> events do not fire.</p>
+
 
 
   <h6><dfn title="attr-input-type-image">Image Button</dfn> state</h6>
 
   <p>When an <code>input</code> element's <code
   title="attr-input-type">type</code> attribute is in the <span
   title="attr-input-type-image">Image Button</span> state, the rules
   in this section apply.</p>
 
   <p>The <code>input</code> element represents either an image from
@@ -28246,37 +28353,41 @@ function AddCloud(data, x, y) { ... }</pre>
 
   <p>If the <code title="attr-input-src">src</code> attribute is set,
   and the image is <i>available</i> and the user agent is configured
   to display that image, then: The element represents a control for
   selecting a <span
   title="concept-input-type-image-coordinate">coordinate</span> from
   the image specified by the <code title="attr-input-src">src</code>
   attribute; if the element is <i
   title="concept-input-mutable">mutable</i>, the user should allow the
   user to select this <span
-  title="concept-input-type-image-coordinate">coordinate</span>, at
-  which point the element's <span>form owner</span>, if any, must be
-  <span title="concept-form-submit">submitted</span> from the
-  <code>input</code> element.</p>
+  title="concept-input-type-image-coordinate">coordinate</span>. The
+  <span>activation behavior</span> in this case consists of taking the
+  user's selected <span
+  title="concept-input-type-image-coordinate">coordinate</span>, and
+  then, if the element has a <span>form owner</span>, <span
+  title="concept-form-submit">submitting</span> the <code>input</code>
+  element's <span>form owner</span> from the <code>input</code>
+  element.</p>
 
   <p>Otherwise, the element represents a submit button whose label is
   given by the value of the <code title="attr-input-alt">alt</code>
   attribute; if the element is <i
   title="concept-input-mutable">mutable</i>, the user should allow the
-  user to activate the button, at which point the the <span
+  user to activate the button. The <span>activation behavior</span> in
+  this case consists of setting the <span
   title="concept-input-type-image-coordinate">selected
-  coordinate</span> must be set to (0,0) and the element's <span>form
-  owner</span>, if any, must be <span
-  title="concept-form-submit">submitted</span> from the
-  <code>input</code> element.</p>
-
-  <!-- XXX event timing; activation behavior -->
+  coordinate</span> to (0,0), and then, if the element has a
+  <span>form owner</span>, <span
+  title="concept-form-submit">submitting</span> the <code>input</code>
+  element's <span>form owner</span> from the <code>input</code>
+  element.</p>
 
   <p>The <dfn
   title="concept-input-type-image-coordinate">selected
   coordinate</dfn> must consist of an <var title="">x</var>-component
   and a <var title="">y</var>-component. The <var
   title="">x</var>-component must be greater than or equal to zero,
   and less than or equal to the rendered width, in CSS pixels, of the
   image. The <var title="">y</var>-component must be greater than or
   equal to zero, and less than or equal to the rendered height, in CSS
   pixels, of the image.</p>
@@ -28322,20 +28433,24 @@ function AddCloud(data, x, y) { ... }</pre>
 
   <p>The following DOM attributes and methods do not apply to the element:
   <code class="no-backref" title="dom-input-checked">checked</code>,
   <code class="no-backref" title="dom-input-list">list</code>,
   <code class="no-backref" title="dom-input-selectedOption">selectedOption</code>,
   <code class="no-backref" title="dom-input-valueAsDate">valueAsDate</code> and
   <code class="no-backref" title="dom-input-valueAsNumber">valueAsNumber</code> DOM attributes;
   <code class="no-backref" title="dom-input-stepDown">stepDown()</code> and
   <code class="no-backref" title="dom-input-stepUp">stepUp()</code> methods.</p>
 
+  <p>The <code class="no-backref"
+  title="event-input-input">input</code> and <code class="no-backref"
+  title="event-input-change">change</code> events do not fire.</p>
+
   <p class="note">Many aspects of this state's behavior are similar to
   the behavior of the <code>img</code> element. Readers are encouraged
   to read that section, where many of the same requirements are
   described in more detail.</p>
 
 
 
   <h6><dfn title="attr-input-type-reset">Reset Button</dfn> state</h6>
 
   <p>When an <code>input</code> element's <code
@@ -28345,26 +28460,24 @@ function AddCloud(data, x, y) { ... }</pre>
 
   <p>The <code>input</code> element represents a button that, when
   activated, resets the form. If the element has a <code
   title="attr-input-value">value</code> attribute, the button's label
   must be the value of that attribute; otherwise, it must be an
   implementation-defined string that means "Reset" or some such.</p>
 
   <p>If the element is <i title="concept-input-mutable">mutable</i>,
   the user should allow the user to activate the element.</p>
 
-  <!-- XXX event timing; activation behavior -->
-
-  <p>When the element is activated, if the element has a <span>form
-  owner</span>, the element must <span
-  title="concept-form-reset">reset</span> the <span>form
-  owner</span>.</p>
+  <p>The element's <span>activation behavior</span>, if the element
+  has a <span>form owner</span>, is to <span
+  title="concept-form-reset">reset</span> the <span>form owner</span>;
+  otherwise, it is to do nothing.</p>
 
   <p><strong>Constraint validation:</strong> The element is
   <span>barred from constraint validation</span>.</p>
 
   <p>The <code title="dom-input-value">value</code> DOM attribute
   applies to this element and is in mode <span
   title="dom-input-value-default">default</span>.</p>
 
   <p>The following content attributes must not be specified and do not
   apply to the element:
@@ -28389,39 +28502,42 @@ function AddCloud(data, x, y) { ... }</pre>
 
   <p>The following DOM attributes and methods do not apply to the element:
   <code class="no-backref" title="dom-input-checked">checked</code>,
   <code class="no-backref" title="dom-input-list">list</code>,
   <code class="no-backref" title="dom-input-selectedOption">selectedOption</code>,
   <code class="no-backref" title="dom-input-valueAsDate">valueAsDate</code> and
   <code class="no-backref" title="dom-input-valueAsNumber">valueAsNumber</code> DOM attributes;
   <code class="no-backref" title="dom-input-stepDown">stepDown()</code> and
   <code class="no-backref" title="dom-input-stepUp">stepUp()</code> methods.</p>
 
+  <p>The <code class="no-backref"
+  title="event-input-input">input</code> and <code class="no-backref"
+  title="event-input-change">change</code> events do not fire.</p>
+
 
 
   <h6><dfn title="attr-input-type-button">Button</dfn> state</h6>
 
   <p>When an <code>input</code> element's <code
   title="attr-input-type">type</code> attribute is in the <span
   title="attr-input-type-button">Button</span> state, the rules in
   this section apply.</p>
 
   <p>The <code>input</code> element represents a button with no
   default behavior. If the element has a <code
   title="attr-input-value">value</code> attribute, the button's label
   must be the value of that attribute; otherwise, it must be the empty
   string.</p>
 
   <p>If the element is <i title="concept-input-mutable">mutable</i>,
-  the user should allow the user to activate the element.</p>
-
-  <!-- XXX event timing; activation behavior -->
+  the user should allow the user to activate the element. The
+  element's <span>activation behavior</span> is to do nothing.</p>
 
   <p><strong>Constraint validation:</strong> The element is
   <span>barred from constraint validation</span>.</p>
 
   <p>The <code title="dom-input-value">value</code> DOM attribute
   applies to this element and is in mode <span
   title="dom-input-value-default">default</span>.</p>
 
   <p>The following content attributes must not be specified and do not
   apply to the element:
@@ -28446,20 +28562,24 @@ function AddCloud(data, x, y) { ... }</pre>
 
   <p>The following DOM attributes and methods do not apply to the element:
   <code class="no-backref" title="dom-input-checked">checked</code>,
   <code class="no-backref" title="dom-input-list">list</code>,
   <code class="no-backref" title="dom-input-selectedOption">selectedOption</code>,
   <code class="no-backref" title="dom-input-valueAsDate">valueAsDate</code> and
   <code class="no-backref" title="dom-input-valueAsNumber">valueAsNumber</code> DOM attributes;
   <code class="no-backref" title="dom-input-stepDown">stepDown()</code> and
   <code class="no-backref" title="dom-input-stepUp">stepUp()</code> methods.</p>
 
+  <p>The <code class="no-backref"
+  title="event-input-input">input</code> and <code class="no-backref"
+  title="event-input-change">change</code> events do not fire.</p>
+
 
 
   <h6>Common algorithms</h6>
 
   <p>When a user agent is to <dfn>strip line breaks from the
   value</dfn>, the user agent must remove any U+000A LINE FEED (LF)
   and U+000D CARRIAGE RETURN (CR) characters from <span
   title="concept-fe-value">value</span>.</p>
 
 
@@ -29018,20 +29138,69 @@ function AddCloud(data, x, y) { ... }</pre>
    element to <var title="">value as string</var>.</p></li>
 
   </ol>
 
   <hr>
 
   <p class="XXX">... <dfn title="dom-input-list"><code>list</code></dfn></p>
   <p class="XXX">... <dfn title="dom-input-selectedOption"><code>selectedOption</code></dfn></p>
 
 
+  <h5>Common event behaviors</h5>
+
+  <p>When the <dfn title="event-input-input"><code>input</code></dfn>
+  event applies, the user agent must <span>queue a task</span> to
+  <span>fire a simple event</span> called <code
+  title="event-input">input</code> at the <code>input</code> element
+  any time the user causes the element's <span
+  title="concept-fe-value">value</span> to change. User agents may
+  wait for a suitable break in the user's interaction before queuing
+  the task; for example, a user agent could wait for the user to have
+  not hit a key for 100ms, so as to only fire the event when the user
+  pauses, instead of continuously for each keystroke.</p>
+
+  <p>When the <dfn
+  title="event-input-change"><code>change</code></dfn> event applies,
+  if the element does not have an <span>activation behavior</span>
+  defined but uses a user interface that involves an explicit commit
+  action, then the user agent must <span>queue a task</span> to
+  <span>fire a simple event</span> called <code
+  title="event-change">change</code> at the <code>input</code> element
+  any time the <em>user</em> commits a change to the element's <span
+  title="concept-fe-value">value</span> or list of <span
+  title="concept-input-type-file-selected">selected files</span>.</p>
+
+  <p class="example">An example of a user interface with a commit
+  action would be a <span title="attr-input-type-file">File
+  Upload</span> control that consists of a single button that brings
+  up a file selection dialog: when the dialog is closed, if that the
+  <span title="concept-input-type-file-selected">file selection</span>
+  changed as a result, then the user has commited a new <span
+  title="concept-input-type-file-selected">file selection</span>.</p>
+
+  <p class="example">Another example of a user interface with a commit
+  action would be a <span title="attr-input-type-date">Date</span>
+  control that allows both text-based user input and user selection
+  from a drop-down calendar: while text input might not have an
+  explicit commit step, selecting a date from the drop down calendar
+  and then dismissing the drop down would be a commit action.</p>
+
+  <p>In addition, when the <code
+  title="event-input-change">change</code> event applies, <code
+  title="event-change">change</code> events can also be fired as part
+  of the element's <span>action behavior</span> and as part of the
+  <span>unfocusing steps</span>.</p>
+
+  <p>The <span>task source</span> for these <span
+  title="concept-tasks">task</span> is the <span>user interaction task
+  source</span>.</p>
+
 
 
   <h4>The <dfn><code>button</code></dfn> element</h4>
 
   <dl class="element">
    <dt>Categories</dt>
    <dd><span>Phrasing content</span>.</dd>
    <dd><span>Interactive content</span>.</dd>
    <dd><span title="category-listed">Listed</span>, <span title="category-label">labelable</span>, and <span title="category-submit">submittable</span> <span>form-associated element</span>.</dd>
    <dt>Contexts in which this element may be used:</dt>
@@ -43593,21 +43762,29 @@ at the first element with the given ID must be treated as if it was cloned and r
   </ol>
 
   <p>User agents must run the <span>focusing steps</span> for an
   element whenever the user moves the focus to a
   <span>focusable</span> element.</p>
 
   <p>The <dfn>unfocusing steps</dfn> are as follows:</p>
 
   <ol>
 
-   <!-- XXX onchange event for input controls -->
+   <li><p>If the element is an <code>input</code> element, and the
+   <code title="event-input-change">change</code> event applies to the
+   element, and the element does not have a defined <span>activation
+   behavior</span>, and the user has changed the element's <span
+   title="concept-fe-value">value</span> or its list of <span
+   title="concept-input-type-file-selected">selected files</span>
+   while the control was focused without committing that change, then
+   <span>fire a simple event</span> called <code
+   title="event-change">change</code> at the element.</p>
 
    <li><p>Unfocus the element.</p></li>
 
    <li><p><span>Fire a simple event</span> that doesn't bubble called
    <code title="event-blur">blur</code> at the element.</p></li>
 
   </ol>
 
   <p>User agents should run the <span>unfocusing steps</span> for an
   element whenever the user moves the focus away from any

|