[html5] r7198 - [giow] (0) First pass at an inputmode='' attribute based on actual research. Thi [...]

whatwg at whatwg.org whatwg at whatwg.org
Fri Jul 20 14:40:16 PDT 2012


Author: ianh
Date: 2012-07-20 14:40:14 -0700 (Fri, 20 Jul 2012)
New Revision: 7198

Modified:
   complete.html
   index
   source
Log:
[giow] (0) First pass at an inputmode='' attribute based on actual research. This only handles Latin-script languages and Japanese, currently; if you want other languages supported, please e-mail the whatwg at whatwg.org mailing list with the relevant data. Wiki page: http://wiki.whatwg.org/wiki/Text_input_keyboard_mode_control
Affected topics: DOM APIs, HTML

Modified: complete.html
===================================================================
--- complete.html	2012-07-20 18:35:08 UTC (rev 7197)
+++ complete.html	2012-07-20 21:40:14 UTC (rev 7198)
@@ -696,16 +696,17 @@
         <ol>
          <li><a href=#the-autocomplete-attribute><span class=secno>4.10.7.3.1 </span>The <code title=attr-input-autocomplete>autocomplete</code> attribute</a></li>
          <li><a href=#the-dirname-attribute><span class=secno>4.10.7.3.2 </span>The <code title=attr-input-dirname>dirname</code> attribute</a></li>
-         <li><a href=#the-list-attribute><span class=secno>4.10.7.3.3 </span>The <code title=attr-input-list>list</code> attribute</a></li>
-         <li><a href=#the-readonly-attribute><span class=secno>4.10.7.3.4 </span>The <code title=attr-input-readonly>readonly</code> attribute</a></li>
-         <li><a href=#the-size-attribute><span class=secno>4.10.7.3.5 </span>The <code title=attr-input-size>size</code> attribute</a></li>
-         <li><a href=#the-required-attribute><span class=secno>4.10.7.3.6 </span>The <code title=attr-input-required>required</code> attribute</a></li>
-         <li><a href=#the-multiple-attribute><span class=secno>4.10.7.3.7 </span>The <code title=attr-input-multiple>multiple</code> attribute</a></li>
-         <li><a href=#the-maxlength-attribute><span class=secno>4.10.7.3.8 </span>The <code title=attr-input-maxlength>maxlength</code> attribute</a></li>
-         <li><a href=#the-pattern-attribute><span class=secno>4.10.7.3.9 </span>The <code title=attr-input-pattern>pattern</code> attribute</a></li>
-         <li><a href=#the-min-and-max-attributes><span class=secno>4.10.7.3.10 </span>The <code title=attr-input-min>min</code> and <code title=attr-input-max>max</code> attributes</a></li>
-         <li><a href=#the-step-attribute><span class=secno>4.10.7.3.11 </span>The <code title=attr-input-step>step</code> attribute</a></li>
-         <li><a href=#the-placeholder-attribute><span class=secno>4.10.7.3.12 </span>The <code title=attr-input-placeholder>placeholder</code> attribute</a></ol></li>
+         <li><a href=#the-inputmode-attribute><span class=secno>4.10.7.3.3 </span>The <code title=attr-input-inputmode>inputmode</code> attribute</a></li>
+         <li><a href=#the-list-attribute><span class=secno>4.10.7.3.4 </span>The <code title=attr-input-list>list</code> attribute</a></li>
+         <li><a href=#the-readonly-attribute><span class=secno>4.10.7.3.5 </span>The <code title=attr-input-readonly>readonly</code> attribute</a></li>
+         <li><a href=#the-size-attribute><span class=secno>4.10.7.3.6 </span>The <code title=attr-input-size>size</code> attribute</a></li>
+         <li><a href=#the-required-attribute><span class=secno>4.10.7.3.7 </span>The <code title=attr-input-required>required</code> attribute</a></li>
+         <li><a href=#the-multiple-attribute><span class=secno>4.10.7.3.8 </span>The <code title=attr-input-multiple>multiple</code> attribute</a></li>
+         <li><a href=#the-maxlength-attribute><span class=secno>4.10.7.3.9 </span>The <code title=attr-input-maxlength>maxlength</code> attribute</a></li>
+         <li><a href=#the-pattern-attribute><span class=secno>4.10.7.3.10 </span>The <code title=attr-input-pattern>pattern</code> attribute</a></li>
+         <li><a href=#the-min-and-max-attributes><span class=secno>4.10.7.3.11 </span>The <code title=attr-input-min>min</code> and <code title=attr-input-max>max</code> attributes</a></li>
+         <li><a href=#the-step-attribute><span class=secno>4.10.7.3.12 </span>The <code title=attr-input-step>step</code> attribute</a></li>
+         <li><a href=#the-placeholder-attribute><span class=secno>4.10.7.3.13 </span>The <code title=attr-input-placeholder>placeholder</code> attribute</a></ol></li>
        <li><a href=#common-input-element-apis><span class=secno>4.10.7.4 </span>Common <code>input</code> element APIs</a></li>
        <li><a href=#common-event-behaviors><span class=secno>4.10.7.5 </span>Common event behaviors</a></ol></li>
      <li><a href=#the-button-element><span class=secno>4.10.8 </span>The <code>button</code> element</a></li>
@@ -727,7 +728,8 @@
        <li><a href=#autofocusing-a-form-control><span class=secno>4.10.19.4 </span>Autofocusing a form control</a></li>
        <li><a href=#limiting-user-input-length><span class=secno>4.10.19.5 </span>Limiting user input length</a></li>
        <li><a href=#form-submission-0><span class=secno>4.10.19.6 </span>Form submission</a></li>
-       <li><a href=#submitting-element-directionality><span class=secno>4.10.19.7 </span>Submitting element directionality</a></ol></li>
+       <li><a href=#submitting-element-directionality><span class=secno>4.10.19.7 </span>Submitting element directionality</a></li>
+       <li><a href=#input-modalities><span class=secno>4.10.19.8 </span>Input modalities</a></ol></li>
      <li><a href=#textFieldSelection><span class=secno>4.10.20 </span>APIs for the text field selections</a></li>
      <li><a href=#constraints><span class=secno>4.10.21 </span>Constraints</a>
       <ol>
@@ -45720,6 +45722,7 @@
    <dd><code title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code></dd>
    <dd><code title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code></dd>
    <dd><code title=attr-dim-height><a href=#attr-dim-height>height</a></code></dd>
+   <dd><code title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code></dd>
    <dd><code title=attr-input-list><a href=#attr-input-list>list</a></code></dd>
    <dd><code title=attr-input-max><a href=#attr-input-max>max</a></code></dd>
    <dd><code title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code></dd>
@@ -45756,6 +45759,7 @@
            attribute DOMString <a href=#dom-fs-formtarget title=dom-fs-formTarget>formTarget</a>;
            attribute unsigned long <a href=#dom-input-height title=dom-input-height>height</a>;
            attribute boolean <a href=#dom-input-indeterminate title=dom-input-indeterminate>indeterminate</a>;
+           attribute DOMString <a href=#dom-input-inputmode title=dom-input-inputMode>inputMode</a>;
   readonly attribute <a href=#htmlelement>HTMLElement</a>? <a href=#dom-input-list title=dom-input-list>list</a>;
            attribute DOMString <a href=#dom-input-max title=dom-input-max>max</a>;
            attribute long <a href=#dom-input-maxlength title=dom-input-maxLength>maxLength</a>;
@@ -45906,7 +45910,7 @@
      <td> A button
   </table><p>The <i>missing value default</i> is the <a href="#text-(type=text)-state-and-search-state-(type=search)" title=attr-input-type-text>Text</a> state.</p>
 
-  <p>Which of the <code title=attr-input-accept><a href=#attr-input-accept>accept</a></code>, <code title=attr-input-alt><a href=#attr-input-alt>alt</a></code>, <code title=attr-input-autocomplete><a href=#attr-input-autocomplete>autocomplete</a></code>, <code title=attr-input-checked><a href=#attr-input-checked>checked</a></code>, <code title=attr-input-dirname><a href=#attr-input-dirname>dirname</a></code>, <code title=attr-fs-formaction><a href=#attr-fs-formaction>formaction</a></code>, <code title=attr-fs-formenctype><a href=#attr-fs-formenctype>formenctype</a></code>, <code title=attr-fs-formmethod><a href=#attr-fs-formmethod>formmethod</a></code>, <code title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>, <code title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>, <code title=attr-dim-height><a href=#attr-dim-height>height</a></code>, <code title=attr-input-list><a href=#attr-input-list>list</a></code>, <code tit
 le=attr-input-max><a href=#attr-input-max>max</a></code>, <code title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>, <code title=attr-input-min><a href=#attr-input-min>min</a></code>, <code title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>, <code title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>, <code title=attr-input-placeholder><a href=#attr-input-placeholder>placeholder</a></code>, <code title=attr-input-readonly><a href=#attr-input-readonly>readonly</a></code>, <code title=attr-input-required><a href=#attr-input-required>required</a></code>, <code title=attr-input-size><a href=#attr-input-size>size</a></code>, <code title=attr-input-src><a href=#attr-input-src>src</a></code>, <code title=attr-input-step><a href=#attr-input-step>step</a></code>, and <code title=attr-dim-width><a href=#attr-dim-width>width</a></code> content attributes, the <code title=dom-input-checked><a href=#dom-input-checked>che
 cked</a></code>, <code title=dom-input-files><a href=#dom-input-files>files</a></code>, <code title=dom-input-valueAsDate><a href=#dom-input-valueasdate>valueAsDate</a></code>, <code title=dom-input-valueAsNumber><a href=#dom-input-valueasnumber>valueAsNumber</a></code>, and <code title=dom-input-list><a href=#dom-input-list>list</a></code> IDL attributes, the <code title=dom-textarea/input-select><a href=#dom-textarea/input-select>select()</a></code> method, the <code title=dom-textarea/input-selectionStart><a href=#dom-textarea/input-selectionstart>selectionStart</a></code>,
+  <p>Which of the <code title=attr-input-accept><a href=#attr-input-accept>accept</a></code>, <code title=attr-input-alt><a href=#attr-input-alt>alt</a></code>, <code title=attr-input-autocomplete><a href=#attr-input-autocomplete>autocomplete</a></code>, <code title=attr-input-checked><a href=#attr-input-checked>checked</a></code>, <code title=attr-input-dirname><a href=#attr-input-dirname>dirname</a></code>, <code title=attr-fs-formaction><a href=#attr-fs-formaction>formaction</a></code>, <code title=attr-fs-formenctype><a href=#attr-fs-formenctype>formenctype</a></code>, <code title=attr-fs-formmethod><a href=#attr-fs-formmethod>formmethod</a></code>, <code title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>, <code title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>, <code title=attr-dim-height><a href=#attr-dim-height>height</a></code>, <code title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></c
 ode>, <code title=attr-input-list><a href=#attr-input-list>list</a></code>, <code title=attr-input-max><a href=#attr-input-max>max</a></code>, <code title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>, <code title=attr-input-min><a href=#attr-input-min>min</a></code>, <code title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>, <code title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>, <code title=attr-input-placeholder><a href=#attr-input-placeholder>placeholder</a></code>, <code title=attr-input-readonly><a href=#attr-input-readonly>readonly</a></code>, <code title=attr-input-required><a href=#attr-input-required>required</a></code>, <code title=attr-input-size><a href=#attr-input-size>size</a></code>, <code title=attr-input-src><a href=#attr-input-src>src</a></code>, <code title=attr-input-step><a href=#attr-input-step>step</a></code>, and <code title=attr-dim-width><a href=#attr-dim-width>width</a></code>
  content attributes, the <code title=dom-input-checked><a href=#dom-input-checked>checked</a></code>, <code title=dom-input-files><a href=#dom-input-files>files</a></code>, <code title=dom-input-valueAsDate><a href=#dom-input-valueasdate>valueAsDate</a></code>, <code title=dom-input-valueAsNumber><a href=#dom-input-valueasnumber>valueAsNumber</a></code>, and <code title=dom-input-list><a href=#dom-input-list>list</a></code> IDL attributes, the <code title=dom-textarea/input-select><a href=#dom-textarea/input-select>select()</a></code> method, the <code title=dom-textarea/input-selectionStart><a href=#dom-textarea/input-selectionstart>selectionStart</a></code>,
   <code title=dom-textarea/input-selectionEnd><a href=#dom-textarea/input-selectionend>selectionEnd</a></code>,
   and <code title=dom-textarea/input-selectionDirection><a href=#dom-textarea/input-selectiondirection>selectionDirection</a></code>,
   IDL attributes, the
@@ -46213,6 +46217,30 @@
      <td class=no> · <!-- Reset Button -->
 <!-- <td class="no"> ·      Button -->
 
+    <tr><th> <code title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>
+     <td class=no> · <!-- Hidden -->
+     <td class=yes> Yes     <!-- Text -->
+<!-- <td class="yes"> Yes          Search -->
+     <td class=no> · <!-- URL, Telephone -->
+     <td class=no> · <!-- E-mail -->
+     <td class=no> · <!-- Password -->
+     <td class=no> · <!-- Date and Time -->
+<!-- <td class="no"> ·      Date -->
+<!-- <td class="no"> ·      Month -->
+<!-- <td class="no"> ·      Week -->
+<!-- <td class="no"> ·      Time -->
+     <td class=no> · <!-- Local Date and Time -->
+     <td class=no> · <!-- Number -->
+     <td class=no> · <!-- Range -->
+     <td class=no> · <!-- Color -->
+     <td class=no> · <!-- Checkbox -->
+<!-- <td class="no"> ·      Radio Button -->
+     <td class=no> · <!-- File Upload -->
+     <td class=no> · <!-- Submit Button -->
+     <td class=no> · <!-- Image Button -->
+     <td class=no> · <!-- Reset Button -->
+<!-- <td class="no"> ·      Button -->
+
     <tr><th> <code title=attr-input-list><a href=#attr-input-list>list</a></code>
      <td class=no> · <!-- Hidden -->
      <td class=yes> Yes     <!-- Text -->
@@ -47076,7 +47104,9 @@
   <p>The <dfn id=dom-input-autocomplete title=dom-input-autocomplete><code>autocomplete</code></dfn> and
   <dfn id=dom-input-type title=dom-input-type><code>type</code></dfn> IDL attributes
   must <a href=#reflect>reflect</a> the respective content attributes of the
-  same name, <a href=#limited-to-only-known-values>limited to only known values</a>. The <dfn id=dom-input-maxlength title=dom-input-maxLength><code>maxLength</code></dfn> IDL
+  same name, <a href=#limited-to-only-known-values>limited to only known values</a>. The <dfn id=dom-input-inputmode title=dom-input-inputmode><code>inputMode</code></dfn> IDL
+  attribute must <a href=#reflect>reflect</a> the <code title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code> content attribute,
+  <a href=#limited-to-only-known-values>limited to only known values</a>. The <dfn id=dom-input-maxlength title=dom-input-maxLength><code>maxLength</code></dfn> IDL
   attribute must <a href=#reflect>reflect</a> the <code title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code> content attribute,
   <a href=#limited-to-only-non-negative-numbers>limited to only non-negative numbers</a>.</p>
 
@@ -47160,6 +47190,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
@@ -47261,6 +47292,7 @@
    attributes, IDL attributes, and methods apply to the element:
    <code title=attr-input-autocomplete><a href=#attr-input-autocomplete>autocomplete</a></code>,
    <code title=attr-input-dirname><a href=#attr-input-dirname>dirname</a></code>,
+   <code title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>,
@@ -47395,6 +47427,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-min><a href=#attr-input-min>min</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
@@ -47502,6 +47535,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-min><a href=#attr-input-min>min</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
@@ -47786,6 +47820,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-min><a href=#attr-input-min>min</a></code>,
    <code class=no-backref title=attr-input-src><a href=#attr-input-src>src</a></code>,
@@ -47879,6 +47914,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-min><a href=#attr-input-min>min</a></code>,
@@ -48070,6 +48106,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
    <code class=no-backref title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>,
@@ -48249,6 +48286,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
    <code class=no-backref title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>,
@@ -48404,6 +48442,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
    <code class=no-backref title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>,
@@ -48560,6 +48599,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
    <code class=no-backref title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>,
@@ -48714,6 +48754,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
    <code class=no-backref title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>,
@@ -48865,6 +48906,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
    <code class=no-backref title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>,
@@ -49039,6 +49081,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
    <code class=no-backref title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>,
@@ -49229,6 +49272,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
    <code class=no-backref title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>,
@@ -49386,6 +49430,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code class=no-backref title=attr-input-min><a href=#attr-input-min>min</a></code>,
@@ -49499,6 +49544,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
@@ -49639,6 +49685,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
@@ -49871,6 +49918,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
@@ -49965,6 +50013,7 @@
    <code class=no-backref title=attr-input-checked><a href=#attr-input-checked>checked</a></code>,
    <code class=no-backref title=attr-input-dirname><a href=#attr-input-dirname>dirname</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
@@ -50203,6 +50252,7 @@
    <code class=no-backref title=attr-input-autocomplete><a href=#attr-input-autocomplete>autocomplete</a></code>,
    <code class=no-backref title=attr-input-checked><a href=#attr-input-checked>checked</a></code>,
    <code class=no-backref title=attr-input-dirname><a href=#attr-input-dirname>dirname</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
@@ -50307,6 +50357,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
@@ -50390,6 +50441,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
@@ -50604,8 +50656,16 @@
   </div>
 
 
-  <h6 id=the-list-attribute><span class=secno>4.10.7.3.3 </span>The <code title=attr-input-list><a href=#attr-input-list>list</a></code> attribute</h6>
 
+  <h6 id=the-inputmode-attribute><span class=secno>4.10.7.3.3 </span>The <code title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code> attribute</h6>
+
+  <p>The <dfn id=attr-input-inputmode title=attr-input-inputmode><code>inputmode</code></dfn> attribute,
+  when it applies, is a <a href=#attr-inputmode title=attr-inputmode>form control
+  <code title="">inputmode</code> attribute</a>.</p>
+
+
+  <h6 id=the-list-attribute><span class=secno>4.10.7.3.4 </span>The <code title=attr-input-list><a href=#attr-input-list>list</a></code> attribute</h6>
+
   <p>The <dfn id=attr-input-list title=attr-input-list><code>list</code></dfn>
   attribute is used to identify an element that lists predefined
   options suggested to the user.</p>
@@ -50752,7 +50812,7 @@
 
 
 
-  <h6 id=the-readonly-attribute><span class=secno>4.10.7.3.4 </span>The <code title=attr-input-readonly><a href=#attr-input-readonly>readonly</a></code> attribute</h6>
+  <h6 id=the-readonly-attribute><span class=secno>4.10.7.3.5 </span>The <code title=attr-input-readonly><a href=#attr-input-readonly>readonly</a></code> attribute</h6>
 
   <p>The <dfn id=attr-input-readonly title=attr-input-readonly><code>readonly</code></dfn>
   attribute is a <a href=#boolean-attribute>boolean attribute</a> that controls whether
@@ -50801,7 +50861,7 @@
 
 
 
-  <h6 id=the-size-attribute><span class=secno>4.10.7.3.5 </span>The <code title=attr-input-size><a href=#attr-input-size>size</a></code> attribute</h6>
+  <h6 id=the-size-attribute><span class=secno>4.10.7.3.6 </span>The <code title=attr-input-size><a href=#attr-input-size>size</a></code> attribute</h6>
 
   <p>The <dfn id=attr-input-size title=attr-input-size><code>size</code></dfn>
   attribute gives the number of characters that, in a visual
@@ -50827,7 +50887,7 @@
 
 
 
-  <h6 id=the-required-attribute><span class=secno>4.10.7.3.6 </span>The <code title=attr-input-required><a href=#attr-input-required>required</a></code> attribute</h6>
+  <h6 id=the-required-attribute><span class=secno>4.10.7.3.7 </span>The <code title=attr-input-required><a href=#attr-input-required>required</a></code> attribute</h6>
 
   <p>The <dfn id=attr-input-required title=attr-input-required><code>required</code></dfn>
   attribute is a <a href=#boolean-attribute>boolean attribute</a>. When specified, the
@@ -50870,7 +50930,7 @@
   </div>
 
 
-  <h6 id=the-multiple-attribute><span class=secno>4.10.7.3.7 </span>The <code title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code> attribute</h6>
+  <h6 id=the-multiple-attribute><span class=secno>4.10.7.3.8 </span>The <code title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code> attribute</h6>
 
   <p>The <dfn id=attr-input-multiple title=attr-input-multiple><code>multiple</code></dfn>
   attribute is a <a href=#boolean-attribute>boolean attribute</a> that indicates whether
@@ -50923,7 +50983,7 @@
   </div>
 
 
-  <h6 id=the-maxlength-attribute><span class=secno>4.10.7.3.8 </span>The <code title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code> attribute</h6>
+  <h6 id=the-maxlength-attribute><span class=secno>4.10.7.3.9 </span>The <code title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code> attribute</h6>
 
   <p>The <dfn id=attr-input-maxlength title=attr-input-maxlength><code>maxlength</code></dfn>
   attribute<span class=impl>, when it applies,</span> is a <a href=#attr-fe-maxlength title=attr-fe-maxlength>form control <code title="">maxlength</code> attribute</a><span class=impl>
@@ -50949,7 +51009,7 @@
 
 
 
-  <h6 id=the-pattern-attribute><span class=secno>4.10.7.3.9 </span>The <code title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code> attribute</h6>
+  <h6 id=the-pattern-attribute><span class=secno>4.10.7.3.10 </span>The <code title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code> attribute</h6>
 
   <p>The <dfn id=attr-input-pattern title=attr-input-pattern><code>pattern</code></dfn>
   attribute specifies a regular expression against which the control's
@@ -51037,7 +51097,7 @@
 
 
 
-  <h6 id=the-min-and-max-attributes><span class=secno>4.10.7.3.10 </span>The <code title=attr-input-min><a href=#attr-input-min>min</a></code> and <code title=attr-input-max><a href=#attr-input-max>max</a></code> attributes</h6>
+  <h6 id=the-min-and-max-attributes><span class=secno>4.10.7.3.11 </span>The <code title=attr-input-min><a href=#attr-input-min>min</a></code> and <code title=attr-input-max><a href=#attr-input-max>max</a></code> attributes</h6>
 
   <p>The <dfn id=attr-input-min title=attr-input-min><code>min</code></dfn> and <dfn id=attr-input-max title=attr-input-max><code>max</code></dfn> attributes indicate
   the allowed range of values for the element.</p>
@@ -51118,7 +51178,7 @@
   </div>
 
 
-  <h6 id=the-step-attribute><span class=secno>4.10.7.3.11 </span>The <code title=attr-input-step><a href=#attr-input-step>step</a></code> attribute</h6>
+  <h6 id=the-step-attribute><span class=secno>4.10.7.3.12 </span>The <code title=attr-input-step><a href=#attr-input-step>step</a></code> attribute</h6>
 
   <p>The <dfn id=attr-input-step title=attr-input-step><code>step</code></dfn>
   attribute indicates the granularity that is expected (and required)
@@ -51205,7 +51265,7 @@
 
 
 
-  <h6 id=the-placeholder-attribute><span class=secno>4.10.7.3.12 </span>The <code title=attr-input-placeholder><a href=#attr-input-placeholder>placeholder</a></code> attribute</h6>
+  <h6 id=the-placeholder-attribute><span class=secno>4.10.7.3.13 </span>The <code title=attr-input-placeholder><a href=#attr-input-placeholder>placeholder</a></code> attribute</h6>
 
   <!-- similar text in the <textarea> section -->
 
@@ -52648,6 +52708,7 @@
    <dd><code title=attr-textarea-dirname><a href=#attr-textarea-dirname>dirname</a></code></dd>
    <dd><code title=attr-fe-disabled><a href=#attr-fe-disabled>disabled</a></code></dd>
    <dd><code title=attr-fae-form><a href=#attr-fae-form>form</a></code></dd>
+   <dd><code title=attr-textarea-inputmode><a href=#attr-textarea-inputmode>inputmode</a></code></dd>
    <dd><code title=attr-textarea-maxlength><a href=#attr-textarea-maxlength>maxlength</a></code></dd>
    <dd><code title=attr-fe-name><a href=#attr-fe-name>name</a></code></dd>
    <dd><code title=attr-textarea-placeholder><a href=#attr-textarea-placeholder>placeholder</a></code></dd>
@@ -52663,6 +52724,7 @@
            attribute DOMString <a href=#dom-textarea-dirname title=dom-textarea-dirName>dirName</a>;
            attribute boolean <a href=#dom-fe-disabled title=dom-fe-disabled>disabled</a>;
   readonly attribute <a href=#htmlformelement>HTMLFormElement</a>? <a href=#dom-fae-form title=dom-fae-form>form</a>;
+           attribute DOMString <a href=#dom-textarea-inputmode title=dom-textarea-inputMode>inputMode</a>;
            attribute long <a href=#dom-textarea-maxlength title=dom-textarea-maxLength>maxLength</a>;
            attribute DOMString <a href=#dom-fe-name title=dom-fe-name>name</a>;
            attribute DOMString <a href=#dom-textarea-placeholder title=dom-textarea-placeholder>placeholder</a>;
@@ -52941,6 +53003,9 @@
   attribute is a <a href=#form-control-dirname-attribute>form control <code title="">dirname</code>
   attribute</a>.</p>
 
+  <p>The <dfn id=attr-textarea-inputmode title=attr-textarea-inputmode><code>inputmode</code></dfn>
+  attribute is a <a href=#attr-inputmode title=attr-inputmode>form control <code title="">inputmode</code> attribute</a>.</p>
+
   <p>The <code title=attr-fae-form><a href=#attr-fae-form>form</a></code> attribute is used to
   explicitly associate the <code><a href=#the-textarea-element>textarea</a></code> element with its
   <a href=#form-owner>form owner</a>. The <code title=attr-fe-name><a href=#attr-fe-name>name</a></code>
@@ -52978,7 +53043,9 @@
   20. The <code title=dom-textarea-rows><a href=#dom-textarea-rows>rows</a></code> attribute's
   default value is 2. The <dfn id=dom-textarea-dirname title=dom-textarea-dirName><code>dirName</code></dfn> IDL
   attribute must <a href=#reflect>reflect</a> the <code title=attr-textarea-dirname><a href=#attr-textarea-dirname>dirname</a></code> content attribute. The
-  <dfn id=dom-textarea-maxlength title=dom-textarea-maxLength><code>maxLength</code></dfn> IDL
+  <dfn id=dom-textarea-inputmode title=dom-textarea-inputMode><code>inputMode</code></dfn> IDL
+  attribute must <a href=#reflect>reflect</a> the <code title=attr-textarea-inputmode><a href=#attr-textarea-inputmode>inputmode</a></code> content attribute,
+  <a href=#limited-to-only-known-values>limited to only known values</a>. The <dfn id=dom-textarea-maxlength title=dom-textarea-maxLength><code>maxLength</code></dfn> IDL
   attribute must <a href=#reflect>reflect</a> the <code title=attr-textarea-maxlength><a href=#attr-textarea-maxlength>maxlength</a></code> content attribute,
   <a href=#limited-to-only-non-negative-numbers>limited to only non-negative numbers</a>. The <dfn id=dom-textarea-readonly title=dom-textarea-readOnly><code>readOnly</code></dfn> IDL
   attribute must <a href=#reflect>reflect</a> the <code title=attr-textarea-readonly><a href=#attr-textarea-readonly>readonly</a></code> content
@@ -54595,6 +54662,118 @@
   string.</p>
 
 
+
+  <h5 id=input-modalities><span class=secno>4.10.19.8 </span>Input modalities</h5>
+
+  <p>A <dfn id=attr-inputmode title=attr-inputmode>form control <code title="">inputmode</code> attribute</dfn> on a form control element
+  is an <a href=#enumerated-attribute>enumerated attribute</a> that specifies what kind of
+  input mechanism would be most helpful for users entering content
+  into the form control.</p>
+
+  <div class=impl>
+
+  <p>User agents must recognise all the keywords and corresponding
+  states given below, but need not support all of the corresponding
+  states. If a keyword's state is not supported, the user agent must
+  act as if the keyword instead mapped to the given state's fallback
+  state, as defined below. This fallback behaviour is transitive.</p>
+
+  <p class=note>For example, if a user agent with a QWERTY keyboard
+  layout does not support text prediction and automatic
+  capitalization, then it could treat the <code title=attr-inputmode-keyword-latin-prose><a href=#attr-inputmode-keyword-latin-prose>latin-prose</a></code>
+  keyword in the same way as the <code title=attr-inputmode-keyword-verbatim><a href=#attr-inputmode-keyword-verbatim>verbatim</a></code> keyword,
+  following the chain <a href=#attr-inputmode-state-latin-prose title=attr-inputmode-state-latin-prose>Latin Prose</a> →
+  <a href=#attr-inputmode-state-latin title=attr-inputmode-state-latin>Latin Text</a> →
+  <a href=#attr-inputmode-state-verbatim title=attr-inputmode-state-verbatim>Latin
+  Verbatim</a>.</p>
+
+  </div>
+
+  <p>The possible keywords and states for the attributes are listed in
+  the following table. The keywords are listed in the first column.
+  Each maps to the state given in the cell in the second column of
+  that keyword's row, and that state has the fallback state given in
+  the cell in the third column of that row.</p>
+
+  <table><thead><tr><th> Keyword
+     <th> State
+     <th> Fallback state
+     <th> Description
+
+   <tbody><tr><td> <dfn id=attr-inputmode-keyword-verbatim title=attr-inputmode-keyword-verbatim><code>verbatim</code></dfn>
+     <td> <dfn id=attr-inputmode-state-verbatim title=attr-inputmode-state-verbatim>Latin Verbatim</dfn>
+     <td> <a href=#attr-inputmode-state-default title=attr-inputmode-state-default>Default</a>
+     <td> Alphanumeric Latin-script input of non-prose content, e.g. usernames, passwords, product codes.
+
+    <tr><td> <dfn id=attr-inputmode-keyword-latin title=attr-inputmode-keyword-latin><code>latin</code></dfn>
+     <td> <dfn id=attr-inputmode-state-latin title=attr-inputmode-state-latin>Latin Text</dfn>
+     <td> <a href=#attr-inputmode-state-verbatim title=attr-inputmode-state-verbatim>Latin Verbatim</a>
+     <td> Latin-script input in the user's preferred language(s), with some typing aids enabled (e.g. text prediction). Intended for human-to-computer communications, e.g. free-form text search fields.
+
+    <tr><td> <dfn id=attr-inputmode-keyword-latin-prose title=attr-inputmode-keyword-latin-prose><code>latin-prose</code></dfn>
+     <td> <dfn id=attr-inputmode-state-latin-prose title=attr-inputmode-state-latin-prose>Latin Prose</dfn>
+     <td> <a href=#attr-inputmode-state-latin title=attr-inputmode-state-latin>Latin Text</a>
+     <td> Latin-script input in the user's preferred language(s), with aggressive typing aids intended for human-to-human communications enabled (e.g. text prediction and automatic capitalisation at the start of sentences). Intended for situations such as e-mails and instant messaging.
+
+    <tr><td> <dfn id=attr-inputmode-keyword-full-width-latin title=attr-inputmode-keyword-full-width-latin><code>full-width-latin</code></dfn>
+     <td> <dfn id=attr-inputmode-state-full-width-latin title=attr-inputmode-state-full-width-latin>Full-width Latin</dfn>
+     <td> <a href=#attr-inputmode-state-latin title=attr-inputmode-state-latin>Latin Prose</a>
+     <td> Latin-script input in the user's secondary language(s), using full-width characters, with aggressive typing aids intended for human-to-human communications enabled (e.g. text prediction and automatic capitalisation at the start of sentences). Intended for latin text embedded inside CJK text.
+
+    <tr><td> <dfn id=attr-inputmode-keyword-kana title=attr-inputmode-keyword-kana><code>kana</code></dfn>
+     <td> <dfn id=attr-inputmode-state-kana title=attr-inputmode-state-kana>Kana</dfn>
+     <td> <a href=#attr-inputmode-state-default title=attr-inputmode-state-default>Default</a>
+     <td> Kana or romaji input, typically hiragana input, using full-width characters, with support for converting to kanji. Intended for Japanese text input.
+
+    <tr><td> <dfn id=attr-inputmode-keyword-katakana title=attr-inputmode-keyword-katakana><code>katakana</code></dfn>
+     <td> <dfn id=attr-inputmode-state-katakana title=attr-inputmode-state-katakana>Katakana</dfn>
+     <td> <a href=#attr-inputmode-state-kana title=attr-inputmode-state-kana>Kana</a>
+     <td> Katakana input, using full-width characters, with support for converting to kanji. Intended for Japanese text input.
+
+    <tr><td> <dfn id=attr-inputmode-keyword-half-width-katakana title=attr-inputmode-keyword-half-width-katakana><code>half-width-katakana</code></dfn>
+     <td> <dfn id=attr-inputmode-state-half-width-katakana title=attr-inputmode-state-half-width-katakana>Half-width Katakana</dfn>
+     <td> <a href=#attr-inputmode-state-katakana title=attr-inputmode-state-katakana>Katakana</a>
+     <td> Katakana input, using half-width characters, with support for converting to kanji. Intended for Japanese text input.
+
+    <tr><td> <dfn id=attr-inputmode-keyword-numeric title=attr-inputmode-keyword-numeric><code>numeric</code></dfn>
+     <td> <dfn id=attr-inputmode-state-numeric title=attr-inputmode-state-numeric>Numeric</dfn>
+     <td> <a href=#attr-inputmode-state-default title=attr-inputmode-state-default>Default</a>
+     <td> Numeric input, including keys for the digits 0 to 9, the user's preferred thousands separator character, and the character for indicating negative numbers. Intended for prices, dates, times.
+
+    <tr><td> <dfn id=attr-inputmode-keyword title=attr-inputmode-keyword-><code>tel</code></dfn>
+     <td> <dfn id=attr-inputmode-state-telephone title=attr-inputmode-state-telephone>Telephone</dfn>
+     <td> <a href=#attr-inputmode-state-numeric title=attr-inputmode-state-numeric>Numeric</a>
+     <td> Telephone number input, including keys for the digits 0 to 9, the "#" character, and the "*" character. In some locales, this can also include alphabetic mnemonic labels (e.g. in the US, the key labeled "1" is historically also labeled with the letters A, B, and C).
+
+    <tr><td> <dfn id=attr-inputmode-keyword-email title=attr-inputmode-keyword-email><code>email</code></dfn>
+     <td> <dfn id=attr-inputmode-state-email title=attr-inputmode-state-email>E-mail</dfn>
+     <td> <a href=#attr-inputmode-state-default title=attr-inputmode-state-default>Default</a>
+     <td> Text input in the user's locale, with keys for aiding in the input of e-mail addresses, such as that for the "@" character and the "." character.
+
+    <tr><td> <dfn id=attr-inputmode-keyword-url title=attr-inputmode-keyword-url><code>url</code></dfn>
+     <td> <dfn id=attr-inputmode-state-url title=attr-inputmode-state-url>URL</dfn>
+     <td> <a href=#attr-inputmode-state-default title=attr-inputmode-state-default>Default</a>
+     <td> Text input in the user's locale, with keys for aiding in the input of Web addresses, such as that for the "/" and "." characters and for quick input of strings commonly found in domain names such as "www." or ".co.uk".
+
+  </table><p>User agents <span class=impl>must</span> all support the <dfn id=attr-inputmode-state-default title=attr-inputmode-state-default>Default</dfn> input mode state,
+  which corresponds to the user agent's default input modality. <span class=impl>This specification does not define how the user agent's
+  default modality is to operate.</span> The <i>missing value
+  default</i> is the <a href=#attr-inputmode-state-default title=attr-inputmode-state-default>default input mode</a>
+  state.</p>
+
+  <div class=impl>
+
+  <p>User agents should use the input modality corresponding to the
+  state of the <code title=attr-inputmode><a href=#attr-inputmode>inputmode</a></code> attribute
+  when exposing a user interface for editing the value of a form
+  control to which the attribute applies. This value can change
+  dynamically; user agents should update their interface as the
+  attribute changes state, unless that would go against the user's
+  wishes.</p>
+
+  </div>
+
+
 <!--TOPIC:DOM APIs-->
   <h4 id=textFieldSelection><span class=secno>4.10.20 </span>APIs for the text field selections</h4>
 

Modified: index
===================================================================
--- index	2012-07-20 18:35:08 UTC (rev 7197)
+++ index	2012-07-20 21:40:14 UTC (rev 7198)
@@ -696,16 +696,17 @@
         <ol>
          <li><a href=#the-autocomplete-attribute><span class=secno>4.10.7.3.1 </span>The <code title=attr-input-autocomplete>autocomplete</code> attribute</a></li>
          <li><a href=#the-dirname-attribute><span class=secno>4.10.7.3.2 </span>The <code title=attr-input-dirname>dirname</code> attribute</a></li>
-         <li><a href=#the-list-attribute><span class=secno>4.10.7.3.3 </span>The <code title=attr-input-list>list</code> attribute</a></li>
-         <li><a href=#the-readonly-attribute><span class=secno>4.10.7.3.4 </span>The <code title=attr-input-readonly>readonly</code> attribute</a></li>
-         <li><a href=#the-size-attribute><span class=secno>4.10.7.3.5 </span>The <code title=attr-input-size>size</code> attribute</a></li>
-         <li><a href=#the-required-attribute><span class=secno>4.10.7.3.6 </span>The <code title=attr-input-required>required</code> attribute</a></li>
-         <li><a href=#the-multiple-attribute><span class=secno>4.10.7.3.7 </span>The <code title=attr-input-multiple>multiple</code> attribute</a></li>
-         <li><a href=#the-maxlength-attribute><span class=secno>4.10.7.3.8 </span>The <code title=attr-input-maxlength>maxlength</code> attribute</a></li>
-         <li><a href=#the-pattern-attribute><span class=secno>4.10.7.3.9 </span>The <code title=attr-input-pattern>pattern</code> attribute</a></li>
-         <li><a href=#the-min-and-max-attributes><span class=secno>4.10.7.3.10 </span>The <code title=attr-input-min>min</code> and <code title=attr-input-max>max</code> attributes</a></li>
-         <li><a href=#the-step-attribute><span class=secno>4.10.7.3.11 </span>The <code title=attr-input-step>step</code> attribute</a></li>
-         <li><a href=#the-placeholder-attribute><span class=secno>4.10.7.3.12 </span>The <code title=attr-input-placeholder>placeholder</code> attribute</a></ol></li>
+         <li><a href=#the-inputmode-attribute><span class=secno>4.10.7.3.3 </span>The <code title=attr-input-inputmode>inputmode</code> attribute</a></li>
+         <li><a href=#the-list-attribute><span class=secno>4.10.7.3.4 </span>The <code title=attr-input-list>list</code> attribute</a></li>
+         <li><a href=#the-readonly-attribute><span class=secno>4.10.7.3.5 </span>The <code title=attr-input-readonly>readonly</code> attribute</a></li>
+         <li><a href=#the-size-attribute><span class=secno>4.10.7.3.6 </span>The <code title=attr-input-size>size</code> attribute</a></li>
+         <li><a href=#the-required-attribute><span class=secno>4.10.7.3.7 </span>The <code title=attr-input-required>required</code> attribute</a></li>
+         <li><a href=#the-multiple-attribute><span class=secno>4.10.7.3.8 </span>The <code title=attr-input-multiple>multiple</code> attribute</a></li>
+         <li><a href=#the-maxlength-attribute><span class=secno>4.10.7.3.9 </span>The <code title=attr-input-maxlength>maxlength</code> attribute</a></li>
+         <li><a href=#the-pattern-attribute><span class=secno>4.10.7.3.10 </span>The <code title=attr-input-pattern>pattern</code> attribute</a></li>
+         <li><a href=#the-min-and-max-attributes><span class=secno>4.10.7.3.11 </span>The <code title=attr-input-min>min</code> and <code title=attr-input-max>max</code> attributes</a></li>
+         <li><a href=#the-step-attribute><span class=secno>4.10.7.3.12 </span>The <code title=attr-input-step>step</code> attribute</a></li>
+         <li><a href=#the-placeholder-attribute><span class=secno>4.10.7.3.13 </span>The <code title=attr-input-placeholder>placeholder</code> attribute</a></ol></li>
        <li><a href=#common-input-element-apis><span class=secno>4.10.7.4 </span>Common <code>input</code> element APIs</a></li>
        <li><a href=#common-event-behaviors><span class=secno>4.10.7.5 </span>Common event behaviors</a></ol></li>
      <li><a href=#the-button-element><span class=secno>4.10.8 </span>The <code>button</code> element</a></li>
@@ -727,7 +728,8 @@
        <li><a href=#autofocusing-a-form-control><span class=secno>4.10.19.4 </span>Autofocusing a form control</a></li>
        <li><a href=#limiting-user-input-length><span class=secno>4.10.19.5 </span>Limiting user input length</a></li>
        <li><a href=#form-submission-0><span class=secno>4.10.19.6 </span>Form submission</a></li>
-       <li><a href=#submitting-element-directionality><span class=secno>4.10.19.7 </span>Submitting element directionality</a></ol></li>
+       <li><a href=#submitting-element-directionality><span class=secno>4.10.19.7 </span>Submitting element directionality</a></li>
+       <li><a href=#input-modalities><span class=secno>4.10.19.8 </span>Input modalities</a></ol></li>
      <li><a href=#textFieldSelection><span class=secno>4.10.20 </span>APIs for the text field selections</a></li>
      <li><a href=#constraints><span class=secno>4.10.21 </span>Constraints</a>
       <ol>
@@ -45720,6 +45722,7 @@
    <dd><code title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code></dd>
    <dd><code title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code></dd>
    <dd><code title=attr-dim-height><a href=#attr-dim-height>height</a></code></dd>
+   <dd><code title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code></dd>
    <dd><code title=attr-input-list><a href=#attr-input-list>list</a></code></dd>
    <dd><code title=attr-input-max><a href=#attr-input-max>max</a></code></dd>
    <dd><code title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code></dd>
@@ -45756,6 +45759,7 @@
            attribute DOMString <a href=#dom-fs-formtarget title=dom-fs-formTarget>formTarget</a>;
            attribute unsigned long <a href=#dom-input-height title=dom-input-height>height</a>;
            attribute boolean <a href=#dom-input-indeterminate title=dom-input-indeterminate>indeterminate</a>;
+           attribute DOMString <a href=#dom-input-inputmode title=dom-input-inputMode>inputMode</a>;
   readonly attribute <a href=#htmlelement>HTMLElement</a>? <a href=#dom-input-list title=dom-input-list>list</a>;
            attribute DOMString <a href=#dom-input-max title=dom-input-max>max</a>;
            attribute long <a href=#dom-input-maxlength title=dom-input-maxLength>maxLength</a>;
@@ -45906,7 +45910,7 @@
      <td> A button
   </table><p>The <i>missing value default</i> is the <a href="#text-(type=text)-state-and-search-state-(type=search)" title=attr-input-type-text>Text</a> state.</p>
 
-  <p>Which of the <code title=attr-input-accept><a href=#attr-input-accept>accept</a></code>, <code title=attr-input-alt><a href=#attr-input-alt>alt</a></code>, <code title=attr-input-autocomplete><a href=#attr-input-autocomplete>autocomplete</a></code>, <code title=attr-input-checked><a href=#attr-input-checked>checked</a></code>, <code title=attr-input-dirname><a href=#attr-input-dirname>dirname</a></code>, <code title=attr-fs-formaction><a href=#attr-fs-formaction>formaction</a></code>, <code title=attr-fs-formenctype><a href=#attr-fs-formenctype>formenctype</a></code>, <code title=attr-fs-formmethod><a href=#attr-fs-formmethod>formmethod</a></code>, <code title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>, <code title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>, <code title=attr-dim-height><a href=#attr-dim-height>height</a></code>, <code title=attr-input-list><a href=#attr-input-list>list</a></code>, <code tit
 le=attr-input-max><a href=#attr-input-max>max</a></code>, <code title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>, <code title=attr-input-min><a href=#attr-input-min>min</a></code>, <code title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>, <code title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>, <code title=attr-input-placeholder><a href=#attr-input-placeholder>placeholder</a></code>, <code title=attr-input-readonly><a href=#attr-input-readonly>readonly</a></code>, <code title=attr-input-required><a href=#attr-input-required>required</a></code>, <code title=attr-input-size><a href=#attr-input-size>size</a></code>, <code title=attr-input-src><a href=#attr-input-src>src</a></code>, <code title=attr-input-step><a href=#attr-input-step>step</a></code>, and <code title=attr-dim-width><a href=#attr-dim-width>width</a></code> content attributes, the <code title=dom-input-checked><a href=#dom-input-checked>che
 cked</a></code>, <code title=dom-input-files><a href=#dom-input-files>files</a></code>, <code title=dom-input-valueAsDate><a href=#dom-input-valueasdate>valueAsDate</a></code>, <code title=dom-input-valueAsNumber><a href=#dom-input-valueasnumber>valueAsNumber</a></code>, and <code title=dom-input-list><a href=#dom-input-list>list</a></code> IDL attributes, the <code title=dom-textarea/input-select><a href=#dom-textarea/input-select>select()</a></code> method, the <code title=dom-textarea/input-selectionStart><a href=#dom-textarea/input-selectionstart>selectionStart</a></code>,
+  <p>Which of the <code title=attr-input-accept><a href=#attr-input-accept>accept</a></code>, <code title=attr-input-alt><a href=#attr-input-alt>alt</a></code>, <code title=attr-input-autocomplete><a href=#attr-input-autocomplete>autocomplete</a></code>, <code title=attr-input-checked><a href=#attr-input-checked>checked</a></code>, <code title=attr-input-dirname><a href=#attr-input-dirname>dirname</a></code>, <code title=attr-fs-formaction><a href=#attr-fs-formaction>formaction</a></code>, <code title=attr-fs-formenctype><a href=#attr-fs-formenctype>formenctype</a></code>, <code title=attr-fs-formmethod><a href=#attr-fs-formmethod>formmethod</a></code>, <code title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>, <code title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>, <code title=attr-dim-height><a href=#attr-dim-height>height</a></code>, <code title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></c
 ode>, <code title=attr-input-list><a href=#attr-input-list>list</a></code>, <code title=attr-input-max><a href=#attr-input-max>max</a></code>, <code title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>, <code title=attr-input-min><a href=#attr-input-min>min</a></code>, <code title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>, <code title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>, <code title=attr-input-placeholder><a href=#attr-input-placeholder>placeholder</a></code>, <code title=attr-input-readonly><a href=#attr-input-readonly>readonly</a></code>, <code title=attr-input-required><a href=#attr-input-required>required</a></code>, <code title=attr-input-size><a href=#attr-input-size>size</a></code>, <code title=attr-input-src><a href=#attr-input-src>src</a></code>, <code title=attr-input-step><a href=#attr-input-step>step</a></code>, and <code title=attr-dim-width><a href=#attr-dim-width>width</a></code>
  content attributes, the <code title=dom-input-checked><a href=#dom-input-checked>checked</a></code>, <code title=dom-input-files><a href=#dom-input-files>files</a></code>, <code title=dom-input-valueAsDate><a href=#dom-input-valueasdate>valueAsDate</a></code>, <code title=dom-input-valueAsNumber><a href=#dom-input-valueasnumber>valueAsNumber</a></code>, and <code title=dom-input-list><a href=#dom-input-list>list</a></code> IDL attributes, the <code title=dom-textarea/input-select><a href=#dom-textarea/input-select>select()</a></code> method, the <code title=dom-textarea/input-selectionStart><a href=#dom-textarea/input-selectionstart>selectionStart</a></code>,
   <code title=dom-textarea/input-selectionEnd><a href=#dom-textarea/input-selectionend>selectionEnd</a></code>,
   and <code title=dom-textarea/input-selectionDirection><a href=#dom-textarea/input-selectiondirection>selectionDirection</a></code>,
   IDL attributes, the
@@ -46213,6 +46217,30 @@
      <td class=no> · <!-- Reset Button -->
 <!-- <td class="no"> ·      Button -->
 
+    <tr><th> <code title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>
+     <td class=no> · <!-- Hidden -->
+     <td class=yes> Yes     <!-- Text -->
+<!-- <td class="yes"> Yes          Search -->
+     <td class=no> · <!-- URL, Telephone -->
+     <td class=no> · <!-- E-mail -->
+     <td class=no> · <!-- Password -->
+     <td class=no> · <!-- Date and Time -->
+<!-- <td class="no"> ·      Date -->
+<!-- <td class="no"> ·      Month -->
+<!-- <td class="no"> ·      Week -->
+<!-- <td class="no"> ·      Time -->
+     <td class=no> · <!-- Local Date and Time -->
+     <td class=no> · <!-- Number -->
+     <td class=no> · <!-- Range -->
+     <td class=no> · <!-- Color -->
+     <td class=no> · <!-- Checkbox -->
+<!-- <td class="no"> ·      Radio Button -->
+     <td class=no> · <!-- File Upload -->
+     <td class=no> · <!-- Submit Button -->
+     <td class=no> · <!-- Image Button -->
+     <td class=no> · <!-- Reset Button -->
+<!-- <td class="no"> ·      Button -->
+
     <tr><th> <code title=attr-input-list><a href=#attr-input-list>list</a></code>
      <td class=no> · <!-- Hidden -->
      <td class=yes> Yes     <!-- Text -->
@@ -47076,7 +47104,9 @@
   <p>The <dfn id=dom-input-autocomplete title=dom-input-autocomplete><code>autocomplete</code></dfn> and
   <dfn id=dom-input-type title=dom-input-type><code>type</code></dfn> IDL attributes
   must <a href=#reflect>reflect</a> the respective content attributes of the
-  same name, <a href=#limited-to-only-known-values>limited to only known values</a>. The <dfn id=dom-input-maxlength title=dom-input-maxLength><code>maxLength</code></dfn> IDL
+  same name, <a href=#limited-to-only-known-values>limited to only known values</a>. The <dfn id=dom-input-inputmode title=dom-input-inputmode><code>inputMode</code></dfn> IDL
+  attribute must <a href=#reflect>reflect</a> the <code title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code> content attribute,
+  <a href=#limited-to-only-known-values>limited to only known values</a>. The <dfn id=dom-input-maxlength title=dom-input-maxLength><code>maxLength</code></dfn> IDL
   attribute must <a href=#reflect>reflect</a> the <code title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code> content attribute,
   <a href=#limited-to-only-non-negative-numbers>limited to only non-negative numbers</a>.</p>
 
@@ -47160,6 +47190,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
@@ -47261,6 +47292,7 @@
    attributes, IDL attributes, and methods apply to the element:
    <code title=attr-input-autocomplete><a href=#attr-input-autocomplete>autocomplete</a></code>,
    <code title=attr-input-dirname><a href=#attr-input-dirname>dirname</a></code>,
+   <code title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>,
@@ -47395,6 +47427,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-min><a href=#attr-input-min>min</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
@@ -47502,6 +47535,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-min><a href=#attr-input-min>min</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
@@ -47786,6 +47820,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-min><a href=#attr-input-min>min</a></code>,
    <code class=no-backref title=attr-input-src><a href=#attr-input-src>src</a></code>,
@@ -47879,6 +47914,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-min><a href=#attr-input-min>min</a></code>,
@@ -48070,6 +48106,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
    <code class=no-backref title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>,
@@ -48249,6 +48286,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
    <code class=no-backref title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>,
@@ -48404,6 +48442,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
    <code class=no-backref title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>,
@@ -48560,6 +48599,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
    <code class=no-backref title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>,
@@ -48714,6 +48754,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
    <code class=no-backref title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>,
@@ -48865,6 +48906,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
    <code class=no-backref title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>,
@@ -49039,6 +49081,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
    <code class=no-backref title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>,
@@ -49229,6 +49272,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code class=no-backref title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code>,
    <code class=no-backref title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code>,
@@ -49386,6 +49430,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
    <code class=no-backref title=attr-input-min><a href=#attr-input-min>min</a></code>,
@@ -49499,6 +49544,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
@@ -49639,6 +49685,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
@@ -49871,6 +49918,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
@@ -49965,6 +50013,7 @@
    <code class=no-backref title=attr-input-checked><a href=#attr-input-checked>checked</a></code>,
    <code class=no-backref title=attr-input-dirname><a href=#attr-input-dirname>dirname</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
@@ -50203,6 +50252,7 @@
    <code class=no-backref title=attr-input-autocomplete><a href=#attr-input-autocomplete>autocomplete</a></code>,
    <code class=no-backref title=attr-input-checked><a href=#attr-input-checked>checked</a></code>,
    <code class=no-backref title=attr-input-dirname><a href=#attr-input-dirname>dirname</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
@@ -50307,6 +50357,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
@@ -50390,6 +50441,7 @@
    <code class=no-backref title=attr-fs-formnovalidate><a href=#attr-fs-formnovalidate>formnovalidate</a></code>,
    <code class=no-backref title=attr-fs-formtarget><a href=#attr-fs-formtarget>formtarget</a></code>,
    <code class=no-backref title=attr-dim-height><a href=#attr-dim-height>height</a></code>,
+   <code class=no-backref title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code>,
    <code class=no-backref title=attr-input-list><a href=#attr-input-list>list</a></code>,
    <code class=no-backref title=attr-input-max><a href=#attr-input-max>max</a></code>,
    <code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
@@ -50604,8 +50656,16 @@
   </div>
 
 
-  <h6 id=the-list-attribute><span class=secno>4.10.7.3.3 </span>The <code title=attr-input-list><a href=#attr-input-list>list</a></code> attribute</h6>
 
+  <h6 id=the-inputmode-attribute><span class=secno>4.10.7.3.3 </span>The <code title=attr-input-inputmode><a href=#attr-input-inputmode>inputmode</a></code> attribute</h6>
+
+  <p>The <dfn id=attr-input-inputmode title=attr-input-inputmode><code>inputmode</code></dfn> attribute,
+  when it applies, is a <a href=#attr-inputmode title=attr-inputmode>form control
+  <code title="">inputmode</code> attribute</a>.</p>
+
+
+  <h6 id=the-list-attribute><span class=secno>4.10.7.3.4 </span>The <code title=attr-input-list><a href=#attr-input-list>list</a></code> attribute</h6>
+
   <p>The <dfn id=attr-input-list title=attr-input-list><code>list</code></dfn>
   attribute is used to identify an element that lists predefined
   options suggested to the user.</p>
@@ -50752,7 +50812,7 @@
 
 
 
-  <h6 id=the-readonly-attribute><span class=secno>4.10.7.3.4 </span>The <code title=attr-input-readonly><a href=#attr-input-readonly>readonly</a></code> attribute</h6>
+  <h6 id=the-readonly-attribute><span class=secno>4.10.7.3.5 </span>The <code title=attr-input-readonly><a href=#attr-input-readonly>readonly</a></code> attribute</h6>
 
   <p>The <dfn id=attr-input-readonly title=attr-input-readonly><code>readonly</code></dfn>
   attribute is a <a href=#boolean-attribute>boolean attribute</a> that controls whether
@@ -50801,7 +50861,7 @@
 
 
 
-  <h6 id=the-size-attribute><span class=secno>4.10.7.3.5 </span>The <code title=attr-input-size><a href=#attr-input-size>size</a></code> attribute</h6>
+  <h6 id=the-size-attribute><span class=secno>4.10.7.3.6 </span>The <code title=attr-input-size><a href=#attr-input-size>size</a></code> attribute</h6>
 
   <p>The <dfn id=attr-input-size title=attr-input-size><code>size</code></dfn>
   attribute gives the number of characters that, in a visual
@@ -50827,7 +50887,7 @@
 
 
 
-  <h6 id=the-required-attribute><span class=secno>4.10.7.3.6 </span>The <code title=attr-input-required><a href=#attr-input-required>required</a></code> attribute</h6>
+  <h6 id=the-required-attribute><span class=secno>4.10.7.3.7 </span>The <code title=attr-input-required><a href=#attr-input-required>required</a></code> attribute</h6>
 
   <p>The <dfn id=attr-input-required title=attr-input-required><code>required</code></dfn>
   attribute is a <a href=#boolean-attribute>boolean attribute</a>. When specified, the
@@ -50870,7 +50930,7 @@
   </div>
 
 
-  <h6 id=the-multiple-attribute><span class=secno>4.10.7.3.7 </span>The <code title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code> attribute</h6>
+  <h6 id=the-multiple-attribute><span class=secno>4.10.7.3.8 </span>The <code title=attr-input-multiple><a href=#attr-input-multiple>multiple</a></code> attribute</h6>
 
   <p>The <dfn id=attr-input-multiple title=attr-input-multiple><code>multiple</code></dfn>
   attribute is a <a href=#boolean-attribute>boolean attribute</a> that indicates whether
@@ -50923,7 +50983,7 @@
   </div>
 
 
-  <h6 id=the-maxlength-attribute><span class=secno>4.10.7.3.8 </span>The <code title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code> attribute</h6>
+  <h6 id=the-maxlength-attribute><span class=secno>4.10.7.3.9 </span>The <code title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code> attribute</h6>
 
   <p>The <dfn id=attr-input-maxlength title=attr-input-maxlength><code>maxlength</code></dfn>
   attribute<span class=impl>, when it applies,</span> is a <a href=#attr-fe-maxlength title=attr-fe-maxlength>form control <code title="">maxlength</code> attribute</a><span class=impl>
@@ -50949,7 +51009,7 @@
 
 
 
-  <h6 id=the-pattern-attribute><span class=secno>4.10.7.3.9 </span>The <code title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code> attribute</h6>
+  <h6 id=the-pattern-attribute><span class=secno>4.10.7.3.10 </span>The <code title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code> attribute</h6>
 
   <p>The <dfn id=attr-input-pattern title=attr-input-pattern><code>pattern</code></dfn>
   attribute specifies a regular expression against which the control's
@@ -51037,7 +51097,7 @@
 
 
 
-  <h6 id=the-min-and-max-attributes><span class=secno>4.10.7.3.10 </span>The <code title=attr-input-min><a href=#attr-input-min>min</a></code> and <code title=attr-input-max><a href=#attr-input-max>max</a></code> attributes</h6>
+  <h6 id=the-min-and-max-attributes><span class=secno>4.10.7.3.11 </span>The <code title=attr-input-min><a href=#attr-input-min>min</a></code> and <code title=attr-input-max><a href=#attr-input-max>max</a></code> attributes</h6>
 
   <p>The <dfn id=attr-input-min title=attr-input-min><code>min</code></dfn> and <dfn id=attr-input-max title=attr-input-max><code>max</code></dfn> attributes indicate
   the allowed range of values for the element.</p>
@@ -51118,7 +51178,7 @@
   </div>
 
 
-  <h6 id=the-step-attribute><span class=secno>4.10.7.3.11 </span>The <code title=attr-input-step><a href=#attr-input-step>step</a></code> attribute</h6>
+  <h6 id=the-step-attribute><span class=secno>4.10.7.3.12 </span>The <code title=attr-input-step><a href=#attr-input-step>step</a></code> attribute</h6>
 
   <p>The <dfn id=attr-input-step title=attr-input-step><code>step</code></dfn>
   attribute indicates the granularity that is expected (and required)
@@ -51205,7 +51265,7 @@
 
 
 
-  <h6 id=the-placeholder-attribute><span class=secno>4.10.7.3.12 </span>The <code title=attr-input-placeholder><a href=#attr-input-placeholder>placeholder</a></code> attribute</h6>
+  <h6 id=the-placeholder-attribute><span class=secno>4.10.7.3.13 </span>The <code title=attr-input-placeholder><a href=#attr-input-placeholder>placeholder</a></code> attribute</h6>
 
   <!-- similar text in the <textarea> section -->
 
@@ -52648,6 +52708,7 @@
    <dd><code title=attr-textarea-dirname><a href=#attr-textarea-dirname>dirname</a></code></dd>
    <dd><code title=attr-fe-disabled><a href=#attr-fe-disabled>disabled</a></code></dd>
    <dd><code title=attr-fae-form><a href=#attr-fae-form>form</a></code></dd>
+   <dd><code title=attr-textarea-inputmode><a href=#attr-textarea-inputmode>inputmode</a></code></dd>
    <dd><code title=attr-textarea-maxlength><a href=#attr-textarea-maxlength>maxlength</a></code></dd>
    <dd><code title=attr-fe-name><a href=#attr-fe-name>name</a></code></dd>
    <dd><code title=attr-textarea-placeholder><a href=#attr-textarea-placeholder>placeholder</a></code></dd>
@@ -52663,6 +52724,7 @@
            attribute DOMString <a href=#dom-textarea-dirname title=dom-textarea-dirName>dirName</a>;
            attribute boolean <a href=#dom-fe-disabled title=dom-fe-disabled>disabled</a>;
   readonly attribute <a href=#htmlformelement>HTMLFormElement</a>? <a href=#dom-fae-form title=dom-fae-form>form</a>;
+           attribute DOMString <a href=#dom-textarea-inputmode title=dom-textarea-inputMode>inputMode</a>;
            attribute long <a href=#dom-textarea-maxlength title=dom-textarea-maxLength>maxLength</a>;
            attribute DOMString <a href=#dom-fe-name title=dom-fe-name>name</a>;
            attribute DOMString <a href=#dom-textarea-placeholder title=dom-textarea-placeholder>placeholder</a>;
@@ -52941,6 +53003,9 @@
   attribute is a <a href=#form-control-dirname-attribute>form control <code title="">dirname</code>
   attribute</a>.</p>
 
+  <p>The <dfn id=attr-textarea-inputmode title=attr-textarea-inputmode><code>inputmode</code></dfn>
+  attribute is a <a href=#attr-inputmode title=attr-inputmode>form control <code title="">inputmode</code> attribute</a>.</p>
+
   <p>The <code title=attr-fae-form><a href=#attr-fae-form>form</a></code> attribute is used to
   explicitly associate the <code><a href=#the-textarea-element>textarea</a></code> element with its
   <a href=#form-owner>form owner</a>. The <code title=attr-fe-name><a href=#attr-fe-name>name</a></code>
@@ -52978,7 +53043,9 @@
   20. The <code title=dom-textarea-rows><a href=#dom-textarea-rows>rows</a></code> attribute's
   default value is 2. The <dfn id=dom-textarea-dirname title=dom-textarea-dirName><code>dirName</code></dfn> IDL
   attribute must <a href=#reflect>reflect</a> the <code title=attr-textarea-dirname><a href=#attr-textarea-dirname>dirname</a></code> content attribute. The
-  <dfn id=dom-textarea-maxlength title=dom-textarea-maxLength><code>maxLength</code></dfn> IDL
+  <dfn id=dom-textarea-inputmode title=dom-textarea-inputMode><code>inputMode</code></dfn> IDL
+  attribute must <a href=#reflect>reflect</a> the <code title=attr-textarea-inputmode><a href=#attr-textarea-inputmode>inputmode</a></code> content attribute,
+  <a href=#limited-to-only-known-values>limited to only known values</a>. The <dfn id=dom-textarea-maxlength title=dom-textarea-maxLength><code>maxLength</code></dfn> IDL
   attribute must <a href=#reflect>reflect</a> the <code title=attr-textarea-maxlength><a href=#attr-textarea-maxlength>maxlength</a></code> content attribute,
   <a href=#limited-to-only-non-negative-numbers>limited to only non-negative numbers</a>. The <dfn id=dom-textarea-readonly title=dom-textarea-readOnly><code>readOnly</code></dfn> IDL
   attribute must <a href=#reflect>reflect</a> the <code title=attr-textarea-readonly><a href=#attr-textarea-readonly>readonly</a></code> content
@@ -54595,6 +54662,118 @@
   string.</p>
 
 
+
+  <h5 id=input-modalities><span class=secno>4.10.19.8 </span>Input modalities</h5>
+
+  <p>A <dfn id=attr-inputmode title=attr-inputmode>form control <code title="">inputmode</code> attribute</dfn> on a form control element
+  is an <a href=#enumerated-attribute>enumerated attribute</a> that specifies what kind of
+  input mechanism would be most helpful for users entering content
+  into the form control.</p>
+
+  <div class=impl>
+
+  <p>User agents must recognise all the keywords and corresponding
+  states given below, but need not support all of the corresponding
+  states. If a keyword's state is not supported, the user agent must
+  act as if the keyword instead mapped to the given state's fallback
+  state, as defined below. This fallback behaviour is transitive.</p>
+
+  <p class=note>For example, if a user agent with a QWERTY keyboard
+  layout does not support text prediction and automatic
+  capitalization, then it could treat the <code title=attr-inputmode-keyword-latin-prose><a href=#attr-inputmode-keyword-latin-prose>latin-prose</a></code>
+  keyword in the same way as the <code title=attr-inputmode-keyword-verbatim><a href=#attr-inputmode-keyword-verbatim>verbatim</a></code> keyword,
+  following the chain <a href=#attr-inputmode-state-latin-prose title=attr-inputmode-state-latin-prose>Latin Prose</a> →
+  <a href=#attr-inputmode-state-latin title=attr-inputmode-state-latin>Latin Text</a> →
+  <a href=#attr-inputmode-state-verbatim title=attr-inputmode-state-verbatim>Latin
+  Verbatim</a>.</p>
+
+  </div>
+
+  <p>The possible keywords and states for the attributes are listed in
+  the following table. The keywords are listed in the first column.
+  Each maps to the state given in the cell in the second column of
+  that keyword's row, and that state has the fallback state given in
+  the cell in the third column of that row.</p>
+
+  <table><thead><tr><th> Keyword
+     <th> State
+     <th> Fallback state
+     <th> Description
+
+   <tbody><tr><td> <dfn id=attr-inputmode-keyword-verbatim title=attr-inputmode-keyword-verbatim><code>verbatim</code></dfn>
+     <td> <dfn id=attr-inputmode-state-verbatim title=attr-inputmode-state-verbatim>Latin Verbatim</dfn>
+     <td> <a href=#attr-inputmode-state-default title=attr-inputmode-state-default>Default</a>
+     <td> Alphanumeric Latin-script input of non-prose content, e.g. usernames, passwords, product codes.
+
+    <tr><td> <dfn id=attr-inputmode-keyword-latin title=attr-inputmode-keyword-latin><code>latin</code></dfn>
+     <td> <dfn id=attr-inputmode-state-latin title=attr-inputmode-state-latin>Latin Text</dfn>
+     <td> <a href=#attr-inputmode-state-verbatim title=attr-inputmode-state-verbatim>Latin Verbatim</a>
+     <td> Latin-script input in the user's preferred language(s), with some typing aids enabled (e.g. text prediction). Intended for human-to-computer communications, e.g. free-form text search fields.
+
+    <tr><td> <dfn id=attr-inputmode-keyword-latin-prose title=attr-inputmode-keyword-latin-prose><code>latin-prose</code></dfn>
+     <td> <dfn id=attr-inputmode-state-latin-prose title=attr-inputmode-state-latin-prose>Latin Prose</dfn>
+     <td> <a href=#attr-inputmode-state-latin title=attr-inputmode-state-latin>Latin Text</a>
+     <td> Latin-script input in the user's preferred language(s), with aggressive typing aids intended for human-to-human communications enabled (e.g. text prediction and automatic capitalisation at the start of sentences). Intended for situations such as e-mails and instant messaging.
+
+    <tr><td> <dfn id=attr-inputmode-keyword-full-width-latin title=attr-inputmode-keyword-full-width-latin><code>full-width-latin</code></dfn>
+     <td> <dfn id=attr-inputmode-state-full-width-latin title=attr-inputmode-state-full-width-latin>Full-width Latin</dfn>
+     <td> <a href=#attr-inputmode-state-latin title=attr-inputmode-state-latin>Latin Prose</a>
+     <td> Latin-script input in the user's secondary language(s), using full-width characters, with aggressive typing aids intended for human-to-human communications enabled (e.g. text prediction and automatic capitalisation at the start of sentences). Intended for latin text embedded inside CJK text.
+
+    <tr><td> <dfn id=attr-inputmode-keyword-kana title=attr-inputmode-keyword-kana><code>kana</code></dfn>
+     <td> <dfn id=attr-inputmode-state-kana title=attr-inputmode-state-kana>Kana</dfn>
+     <td> <a href=#attr-inputmode-state-default title=attr-inputmode-state-default>Default</a>
+     <td> Kana or romaji input, typically hiragana input, using full-width characters, with support for converting to kanji. Intended for Japanese text input.
+
+    <tr><td> <dfn id=attr-inputmode-keyword-katakana title=attr-inputmode-keyword-katakana><code>katakana</code></dfn>
+     <td> <dfn id=attr-inputmode-state-katakana title=attr-inputmode-state-katakana>Katakana</dfn>
+     <td> <a href=#attr-inputmode-state-kana title=attr-inputmode-state-kana>Kana</a>
+     <td> Katakana input, using full-width characters, with support for converting to kanji. Intended for Japanese text input.
+
+    <tr><td> <dfn id=attr-inputmode-keyword-half-width-katakana title=attr-inputmode-keyword-half-width-katakana><code>half-width-katakana</code></dfn>
+     <td> <dfn id=attr-inputmode-state-half-width-katakana title=attr-inputmode-state-half-width-katakana>Half-width Katakana</dfn>
+     <td> <a href=#attr-inputmode-state-katakana title=attr-inputmode-state-katakana>Katakana</a>
+     <td> Katakana input, using half-width characters, with support for converting to kanji. Intended for Japanese text input.
+
+    <tr><td> <dfn id=attr-inputmode-keyword-numeric title=attr-inputmode-keyword-numeric><code>numeric</code></dfn>
+     <td> <dfn id=attr-inputmode-state-numeric title=attr-inputmode-state-numeric>Numeric</dfn>
+     <td> <a href=#attr-inputmode-state-default title=attr-inputmode-state-default>Default</a>
+     <td> Numeric input, including keys for the digits 0 to 9, the user's preferred thousands separator character, and the character for indicating negative numbers. Intended for prices, dates, times.
+
+    <tr><td> <dfn id=attr-inputmode-keyword title=attr-inputmode-keyword-><code>tel</code></dfn>
+     <td> <dfn id=attr-inputmode-state-telephone title=attr-inputmode-state-telephone>Telephone</dfn>
+     <td> <a href=#attr-inputmode-state-numeric title=attr-inputmode-state-numeric>Numeric</a>
+     <td> Telephone number input, including keys for the digits 0 to 9, the "#" character, and the "*" character. In some locales, this can also include alphabetic mnemonic labels (e.g. in the US, the key labeled "1" is historically also labeled with the letters A, B, and C).
+
+    <tr><td> <dfn id=attr-inputmode-keyword-email title=attr-inputmode-keyword-email><code>email</code></dfn>
+     <td> <dfn id=attr-inputmode-state-email title=attr-inputmode-state-email>E-mail</dfn>
+     <td> <a href=#attr-inputmode-state-default title=attr-inputmode-state-default>Default</a>
+     <td> Text input in the user's locale, with keys for aiding in the input of e-mail addresses, such as that for the "@" character and the "." character.
+
+    <tr><td> <dfn id=attr-inputmode-keyword-url title=attr-inputmode-keyword-url><code>url</code></dfn>
+     <td> <dfn id=attr-inputmode-state-url title=attr-inputmode-state-url>URL</dfn>
+     <td> <a href=#attr-inputmode-state-default title=attr-inputmode-state-default>Default</a>
+     <td> Text input in the user's locale, with keys for aiding in the input of Web addresses, such as that for the "/" and "." characters and for quick input of strings commonly found in domain names such as "www." or ".co.uk".
+
+  </table><p>User agents <span class=impl>must</span> all support the <dfn id=attr-inputmode-state-default title=attr-inputmode-state-default>Default</dfn> input mode state,
+  which corresponds to the user agent's default input modality. <span class=impl>This specification does not define how the user agent's
+  default modality is to operate.</span> The <i>missing value
+  default</i> is the <a href=#attr-inputmode-state-default title=attr-inputmode-state-default>default input mode</a>
+  state.</p>
+
+  <div class=impl>
+
+  <p>User agents should use the input modality corresponding to the
+  state of the <code title=attr-inputmode><a href=#attr-inputmode>inputmode</a></code> attribute
+  when exposing a user interface for editing the value of a form
+  control to which the attribute applies. This value can change
+  dynamically; user agents should update their interface as the
+  attribute changes state, unless that would go against the user's
+  wishes.</p>
+
+  </div>
+
+
 <!--TOPIC:DOM APIs-->
   <h4 id=textFieldSelection><span class=secno>4.10.20 </span>APIs for the text field selections</h4>
 

Modified: source
===================================================================
--- source	2012-07-20 18:35:08 UTC (rev 7197)
+++ source	2012-07-20 21:40:14 UTC (rev 7198)
@@ -53436,6 +53436,7 @@
    <dd><code title="attr-fs-formnovalidate">formnovalidate</code></dd>
    <dd><code title="attr-fs-formtarget">formtarget</code></dd>
    <dd><code title="attr-dim-height">height</code></dd>
+   <dd><code title="attr-input-inputmode">inputmode</code></dd>
    <dd><code title="attr-input-list">list</code></dd>
    <dd><code title="attr-input-max">max</code></dd>
    <dd><code title="attr-input-maxlength">maxlength</code></dd>
@@ -53472,6 +53473,7 @@
            attribute DOMString <span title="dom-fs-formTarget">formTarget</span>;
            attribute unsigned long <span title="dom-input-height">height</span>;
            attribute boolean <span title="dom-input-indeterminate">indeterminate</span>;
+           attribute DOMString <span title="dom-input-inputMode">inputMode</span>;
   readonly attribute <span>HTMLElement</span>? <span title="dom-input-list">list</span>;
            attribute DOMString <span title="dom-input-max">max</span>;
            attribute long <span title="dom-input-maxLength">maxLength</span>;
@@ -53665,6 +53667,7 @@
   title="attr-fs-formnovalidate">formnovalidate</code>, <code
   title="attr-fs-formtarget">formtarget</code>, <code
   title="attr-dim-height">height</code>, <code
+  title="attr-input-inputmode">inputmode</code>, <code
   title="attr-input-list">list</code>, <code
   title="attr-input-max">max</code>, <code
   title="attr-input-maxlength">maxlength</code>, <code
@@ -54012,6 +54015,31 @@
 <!-- <td class="no"> ·      Button -->
 
     <tr>
+     <th> <code title="attr-input-inputmode">inputmode</code>
+     <td class="no"> · <!-- Hidden -->
+     <td class="yes"> Yes     <!-- Text -->
+<!-- <td class="yes"> Yes          Search -->
+     <td class="no"> · <!-- URL, Telephone -->
+     <td class="no"> · <!-- E-mail -->
+     <td class="no"> · <!-- Password -->
+     <td class="no"> · <!-- Date and Time -->
+<!-- <td class="no"> ·      Date -->
+<!-- <td class="no"> ·      Month -->
+<!-- <td class="no"> ·      Week -->
+<!-- <td class="no"> ·      Time -->
+     <td class="no"> · <!-- Local Date and Time -->
+     <td class="no"> · <!-- Number -->
+     <td class="no"> · <!-- Range -->
+     <td class="no"> · <!-- Color -->
+     <td class="no"> · <!-- Checkbox -->
+<!-- <td class="no"> ·      Radio Button -->
+     <td class="no"> · <!-- File Upload -->
+     <td class="no"> · <!-- Submit Button -->
+     <td class="no"> · <!-- Image Button -->
+     <td class="no"> · <!-- Reset Button -->
+<!-- <td class="no"> ·      Button -->
+
+    <tr>
      <th> <code title="attr-input-list">list</code>
      <td class="no"> · <!-- Hidden -->
      <td class="yes"> Yes     <!-- Text -->
@@ -54995,6 +55023,10 @@
   <dfn title="dom-input-type"><code>type</code></dfn> IDL attributes
   must <span>reflect</span> the respective content attributes of the
   same name, <span>limited to only known values</span>. The <dfn
+  title="dom-input-inputmode"><code>inputMode</code></dfn> IDL
+  attribute must <span>reflect</span> the <code
+  title="attr-input-inputmode">inputmode</code> content attribute,
+  <span>limited to only known values</span>. The <dfn
   title="dom-input-maxLength"><code>maxLength</code></dfn> IDL
   attribute must <span>reflect</span> the <code
   title="attr-input-maxlength">maxlength</code> content attribute,
@@ -55100,6 +55132,7 @@
    <code class="no-backref" title="attr-fs-formnovalidate">formnovalidate</code>,
    <code class="no-backref" title="attr-fs-formtarget">formtarget</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</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>,
@@ -55217,6 +55250,7 @@
    attributes, IDL attributes, and methods apply to the element:
    <code title="attr-input-autocomplete">autocomplete</code>,
    <code title="attr-input-dirname">dirname</code>,
+   <code title="attr-input-inputmode">inputmode</code>,
    <code title="attr-input-list">list</code>,
    <code title="attr-input-maxlength">maxlength</code>,
    <code title="attr-input-pattern">pattern</code>,
@@ -55362,6 +55396,7 @@
    <code class="no-backref" title="attr-fs-formnovalidate">formnovalidate</code>,
    <code class="no-backref" title="attr-fs-formtarget">formtarget</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</code>,
    <code class="no-backref" title="attr-input-max">max</code>,
    <code class="no-backref" title="attr-input-min">min</code>,
    <code class="no-backref" title="attr-input-multiple">multiple</code>,
@@ -55477,6 +55512,7 @@
    <code class="no-backref" title="attr-fs-formnovalidate">formnovalidate</code>,
    <code class="no-backref" title="attr-fs-formtarget">formtarget</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</code>,
    <code class="no-backref" title="attr-input-max">max</code>,
    <code class="no-backref" title="attr-input-min">min</code>,
    <code class="no-backref" title="attr-input-multiple">multiple</code>,
@@ -55802,6 +55838,7 @@
    <code class="no-backref" title="attr-fs-formnovalidate">formnovalidate</code>,
    <code class="no-backref" title="attr-fs-formtarget">formtarget</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</code>,
    <code class="no-backref" title="attr-input-max">max</code>,
    <code class="no-backref" title="attr-input-min">min</code>,
    <code class="no-backref" title="attr-input-src">src</code>,
@@ -55901,6 +55938,7 @@
    <code class="no-backref" title="attr-fs-formnovalidate">formnovalidate</code>,
    <code class="no-backref" title="attr-fs-formtarget">formtarget</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</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-min">min</code>,
@@ -56120,6 +56158,7 @@
    <code class="no-backref" title="attr-fs-formnovalidate">formnovalidate</code>,
    <code class="no-backref" title="attr-fs-formtarget">formtarget</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</code>,
    <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
    <code class="no-backref" title="attr-input-multiple">multiple</code>,
    <code class="no-backref" title="attr-input-pattern">pattern</code>,
@@ -56325,6 +56364,7 @@
    <code class="no-backref" title="attr-fs-formnovalidate">formnovalidate</code>,
    <code class="no-backref" title="attr-fs-formtarget">formtarget</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</code>,
    <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
    <code class="no-backref" title="attr-input-multiple">multiple</code>,
    <code class="no-backref" title="attr-input-pattern">pattern</code>,
@@ -56503,6 +56543,7 @@
    <code class="no-backref" title="attr-fs-formnovalidate">formnovalidate</code>,
    <code class="no-backref" title="attr-fs-formtarget">formtarget</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</code>,
    <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
    <code class="no-backref" title="attr-input-multiple">multiple</code>,
    <code class="no-backref" title="attr-input-pattern">pattern</code>,
@@ -56684,6 +56725,7 @@
    <code class="no-backref" title="attr-fs-formnovalidate">formnovalidate</code>,
    <code class="no-backref" title="attr-fs-formtarget">formtarget</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</code>,
    <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
    <code class="no-backref" title="attr-input-multiple">multiple</code>,
    <code class="no-backref" title="attr-input-pattern">pattern</code>,
@@ -56862,6 +56904,7 @@
    <code class="no-backref" title="attr-fs-formnovalidate">formnovalidate</code>,
    <code class="no-backref" title="attr-fs-formtarget">formtarget</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</code>,
    <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
    <code class="no-backref" title="attr-input-multiple">multiple</code>,
    <code class="no-backref" title="attr-input-pattern">pattern</code>,
@@ -57030,6 +57073,7 @@
    <code class="no-backref" title="attr-fs-formnovalidate">formnovalidate</code>,
    <code class="no-backref" title="attr-fs-formtarget">formtarget</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</code>,
    <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
    <code class="no-backref" title="attr-input-multiple">multiple</code>,
    <code class="no-backref" title="attr-input-pattern">pattern</code>,
@@ -57215,6 +57259,7 @@
    <code class="no-backref" title="attr-fs-formnovalidate">formnovalidate</code>,
    <code class="no-backref" title="attr-fs-formtarget">formtarget</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</code>,
    <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
    <code class="no-backref" title="attr-input-multiple">multiple</code>,
    <code class="no-backref" title="attr-input-pattern">pattern</code>,
@@ -57431,6 +57476,7 @@
    <code class="no-backref" title="attr-fs-formnovalidate">formnovalidate</code>,
    <code class="no-backref" title="attr-fs-formtarget">formtarget</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</code>,
    <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
    <code class="no-backref" title="attr-input-multiple">multiple</code>,
    <code class="no-backref" title="attr-input-pattern">pattern</code>,
@@ -57596,6 +57642,7 @@
    <code class="no-backref" title="attr-fs-formnovalidate">formnovalidate</code>,
    <code class="no-backref" title="attr-fs-formtarget">formtarget</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</code>,
    <code class="no-backref" title="attr-input-max">max</code>,
    <code class="no-backref" title="attr-input-maxlength">maxlength</code>,
    <code class="no-backref" title="attr-input-min">min</code>,
@@ -57727,6 +57774,7 @@
    <code class="no-backref" title="attr-fs-formnovalidate">formnovalidate</code>,
    <code class="no-backref" title="attr-fs-formtarget">formtarget</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</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>,
@@ -57888,6 +57936,7 @@
    <code class="no-backref" title="attr-fs-formnovalidate">formnovalidate</code>,
    <code class="no-backref" title="attr-fs-formtarget">formtarget</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</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>,
@@ -58137,6 +58186,7 @@
    <code class="no-backref" title="attr-fs-formnovalidate">formnovalidate</code>,
    <code class="no-backref" title="attr-fs-formtarget">formtarget</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</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>,
@@ -58243,6 +58293,7 @@
    <code class="no-backref" title="attr-input-checked">checked</code>,
    <code class="no-backref" title="attr-input-dirname">dirname</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</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>,
@@ -58552,6 +58603,7 @@
    <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-input-dirname">dirname</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</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>,
@@ -58665,6 +58717,7 @@
    <code class="no-backref" title="attr-fs-formnovalidate">formnovalidate</code>,
    <code class="no-backref" title="attr-fs-formtarget">formtarget</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</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>,
@@ -58755,6 +58808,7 @@
    <code class="no-backref" title="attr-fs-formnovalidate">formnovalidate</code>,
    <code class="no-backref" title="attr-fs-formtarget">formtarget</code>,
    <code class="no-backref" title="attr-dim-height">height</code>,
+   <code class="no-backref" title="attr-input-inputmode">inputmode</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>,
@@ -58993,6 +59047,15 @@
   </div>
 
 
+
+  <h6>The <code title="attr-input-inputmode">inputmode</code> attribute</h6>
+
+  <p>The <dfn
+  title="attr-input-inputmode"><code>inputmode</code></dfn> attribute,
+  when it applies, is a <span title="attr-inputmode">form control
+  <code title="">inputmode</code> attribute</span>.</p>
+
+
   <h6>The <code title="attr-input-list">list</code> attribute</h6>
 
   <p>The <dfn title="attr-input-list"><code>list</code></dfn>
@@ -61439,6 +61502,7 @@
    <dd><code title="attr-textarea-dirname">dirname</code></dd>
    <dd><code title="attr-fe-disabled">disabled</code></dd>
    <dd><code title="attr-fae-form">form</code></dd>
+   <dd><code title="attr-textarea-inputmode">inputmode</code></dd>
    <dd><code title="attr-textarea-maxlength">maxlength</code></dd>
    <dd><code title="attr-fe-name">name</code></dd>
    <dd><code title="attr-textarea-placeholder">placeholder</code></dd>
@@ -61454,6 +61518,7 @@
            attribute DOMString <span title="dom-textarea-dirName">dirName</span>;
            attribute boolean <span title="dom-fe-disabled">disabled</span>;
   readonly attribute <span>HTMLFormElement</span>? <span title="dom-fae-form">form</span>;
+           attribute DOMString <span title="dom-textarea-inputMode">inputMode</span>;
            attribute long <span title="dom-textarea-maxLength">maxLength</span>;
            attribute DOMString <span title="dom-fe-name">name</span>;
            attribute DOMString <span title="dom-textarea-placeholder">placeholder</span>;
@@ -61786,6 +61851,11 @@
   attribute is a <span>form control <code title="">dirname</code>
   attribute</span>.</p>
 
+  <p>The <dfn
+  title="attr-textarea-inputmode"><code>inputmode</code></dfn>
+  attribute is a <span title="attr-inputmode">form control <code
+  title="">inputmode</code> attribute</span>.</p>
+
   <p>The <code title="attr-fae-form">form</code> attribute is used to
   explicitly associate the <code>textarea</code> element with its
   <span>form owner</span>. The <code title="attr-fe-name">name</code>
@@ -61835,8 +61905,12 @@
   title="dom-textarea-dirName"><code>dirName</code></dfn> IDL
   attribute must <span>reflect</span> the <code
   title="attr-textarea-dirname">dirname</code> content attribute. The
-  <dfn title="dom-textarea-maxLength"><code>maxLength</code></dfn> IDL
+  <dfn title="dom-textarea-inputMode"><code>inputMode</code></dfn> IDL
   attribute must <span>reflect</span> the <code
+  title="attr-textarea-inputmode">inputmode</code> content attribute,
+  <span>limited to only known values</span>. The <dfn
+  title="dom-textarea-maxLength"><code>maxLength</code></dfn> IDL
+  attribute must <span>reflect</span> the <code
   title="attr-textarea-maxlength">maxlength</code> content attribute,
   <span>limited to only non-negative numbers</span>. The <dfn
   title="dom-textarea-readOnly"><code>readOnly</code></dfn> IDL
@@ -63744,6 +63818,144 @@
   string.</p>
 
 
+
+  <h5>Input modalities</h5>
+
+  <p>A <dfn title="attr-inputmode">form control <code
+  title="">inputmode</code> attribute</dfn> on a form control element
+  is an <span>enumerated attribute</span> that specifies what kind of
+  input mechanism would be most helpful for users entering content
+  into the form control.</p>
+
+  <div class="impl">
+
+  <p>User agents must recognise all the keywords and corresponding
+  states given below, but need not support all of the corresponding
+  states. If a keyword's state is not supported, the user agent must
+  act as if the keyword instead mapped to the given state's fallback
+  state, as defined below. This fallback behaviour is transitive.</p>
+
+  <p class="note">For example, if a user agent with a QWERTY keyboard
+  layout does not support text prediction and automatic
+  capitalization, then it could treat the <code
+  title="attr-inputmode-keyword-latin-prose">latin-prose</code>
+  keyword in the same way as the <code
+  title="attr-inputmode-keyword-verbatim">verbatim</code> keyword,
+  following the chain <span
+  title="attr-inputmode-state-latin-prose">Latin Prose</span> &#x2192;
+  <span title="attr-inputmode-state-latin">Latin Text</span> &#x2192;
+  <span title="attr-inputmode-state-verbatim">Latin
+  Verbatim</span>.</p>
+
+  </div>
+
+  <p>The possible keywords and states for the attributes are listed in
+  the following table. The keywords are listed in the first column.
+  Each maps to the state given in the cell in the second column of
+  that keyword's row, and that state has the fallback state given in
+  the cell in the third column of that row.</p>
+
+  <table>
+
+   <thead>
+    <tr>
+     <th> Keyword
+     <th> State
+     <th> Fallback state
+     <th> Description
+
+   <tbody>
+
+    <tr>
+     <td> <dfn title="attr-inputmode-keyword-verbatim"><code>verbatim</code></dfn>
+     <td> <dfn title="attr-inputmode-state-verbatim">Latin Verbatim</dfn>
+     <td> <span title="attr-inputmode-state-default">Default</span>
+     <td> Alphanumeric Latin-script input of non-prose content, e.g. usernames, passwords, product codes.
+
+    <tr>
+     <td> <dfn title="attr-inputmode-keyword-latin"><code>latin</code></dfn>
+     <td> <dfn title="attr-inputmode-state-latin">Latin Text</dfn>
+     <td> <span title="attr-inputmode-state-verbatim">Latin Verbatim</span>
+     <td> Latin-script input in the user's preferred language(s), with some typing aids enabled (e.g. text prediction). Intended for human-to-computer communications, e.g. free-form text search fields.
+
+    <tr>
+     <td> <dfn title="attr-inputmode-keyword-latin-prose"><code>latin-prose</code></dfn>
+     <td> <dfn title="attr-inputmode-state-latin-prose">Latin Prose</dfn>
+     <td> <span title="attr-inputmode-state-latin">Latin Text</span>
+     <td> Latin-script input in the user's preferred language(s), with aggressive typing aids intended for human-to-human communications enabled (e.g. text prediction and automatic capitalisation at the start of sentences). Intended for situations such as e-mails and instant messaging.
+
+    <tr>
+     <td> <dfn title="attr-inputmode-keyword-full-width-latin"><code>full-width-latin</code></dfn>
+     <td> <dfn title="attr-inputmode-state-full-width-latin">Full-width Latin</dfn>
+     <td> <span title="attr-inputmode-state-latin">Latin Prose</span>
+     <td> Latin-script input in the user's secondary language(s), using full-width characters, with aggressive typing aids intended for human-to-human communications enabled (e.g. text prediction and automatic capitalisation at the start of sentences). Intended for latin text embedded inside CJK text.
+
+    <tr>
+     <td> <dfn title="attr-inputmode-keyword-kana"><code>kana</code></dfn>
+     <td> <dfn title="attr-inputmode-state-kana">Kana</dfn>
+     <td> <span title="attr-inputmode-state-default">Default</span>
+     <td> Kana or romaji input, typically hiragana input, using full-width characters, with support for converting to kanji. Intended for Japanese text input.
+
+    <tr>
+     <td> <dfn title="attr-inputmode-keyword-katakana"><code>katakana</code></dfn>
+     <td> <dfn title="attr-inputmode-state-katakana">Katakana</dfn>
+     <td> <span title="attr-inputmode-state-kana">Kana</span>
+     <td> Katakana input, using full-width characters, with support for converting to kanji. Intended for Japanese text input.
+
+    <tr>
+     <td> <dfn title="attr-inputmode-keyword-half-width-katakana"><code>half-width-katakana</code></dfn>
+     <td> <dfn title="attr-inputmode-state-half-width-katakana">Half-width Katakana</dfn>
+     <td> <span title="attr-inputmode-state-katakana">Katakana</span>
+     <td> Katakana input, using half-width characters, with support for converting to kanji. Intended for Japanese text input.
+
+    <tr>
+     <td> <dfn title="attr-inputmode-keyword-numeric"><code>numeric</code></dfn>
+     <td> <dfn title="attr-inputmode-state-numeric">Numeric</dfn>
+     <td> <span title="attr-inputmode-state-default">Default</span>
+     <td> Numeric input, including keys for the digits 0 to 9, the user's preferred thousands separator character, and the character for indicating negative numbers. Intended for prices, dates, times.
+
+    <tr>
+     <td> <dfn title="attr-inputmode-keyword-"><code>tel</code></dfn>
+     <td> <dfn title="attr-inputmode-state-telephone">Telephone</dfn>
+     <td> <span title="attr-inputmode-state-numeric">Numeric</span>
+     <td> Telephone number input, including keys for the digits 0 to 9, the "#" character, and the "*" character. In some locales, this can also include alphabetic mnemonic labels (e.g. in the US, the key labeled "1" is historically also labeled with the letters A, B, and C).
+
+    <tr>
+     <td> <dfn title="attr-inputmode-keyword-email"><code>email</code></dfn>
+     <td> <dfn title="attr-inputmode-state-email">E-mail</dfn>
+     <td> <span title="attr-inputmode-state-default">Default</span>
+     <td> Text input in the user's locale, with keys for aiding in the input of e-mail addresses, such as that for the "@" character and the "." character.
+
+    <tr>
+     <td> <dfn title="attr-inputmode-keyword-url"><code>url</code></dfn>
+     <td> <dfn title="attr-inputmode-state-url">URL</dfn>
+     <td> <span title="attr-inputmode-state-default">Default</span>
+     <td> Text input in the user's locale, with keys for aiding in the input of Web addresses, such as that for the "/" and "." characters and for quick input of strings commonly found in domain names such as "www." or ".co.uk".
+
+  </table>
+
+  <p>User agents <span class="impl">must</span> all support the <dfn
+  title="attr-inputmode-state-default">Default</dfn> input mode state,
+  which corresponds to the user agent's default input modality. <span
+  class="impl">This specification does not define how the user agent's
+  default modality is to operate.</span> The <i>missing value
+  default</i> is the <span
+  title="attr-inputmode-state-default">default input mode</span>
+  state.</p>
+
+  <div class="impl">
+
+  <p>User agents should use the input modality corresponding to the
+  state of the <code title="attr-inputmode">inputmode</code> attribute
+  when exposing a user interface for editing the value of a form
+  control to which the attribute applies. This value can change
+  dynamically; user agents should update their interface as the
+  attribute changes state, unless that would go against the user's
+  wishes.</p>
+
+  </div>
+
+
 <!--TOPIC:DOM APIs-->
   <h4 id="textFieldSelection">APIs for the text field selections</h4>
 




More information about the Commit-Watchers mailing list