compositionend

  • Revision slug: DOM/DOM_event_reference/compositionend
  • Revision title: compositionend
  • Revision id: 59056
  • Created:
  • Creator: Sheppy
  • Is current revision? No
  • Comment clean up; 250 words added, 49 words removed

Revision Content

The DOM compositionstart event is fired synchronously when composed text is committed, such as when the user tells the IME they're finished editing text. It's represented by the {{ domxref("CompositionEvent") }} interface.

Note: This event should handle starting the text composition system, but in Gecko it's the other way around; when the system starts its composition system, Gecko fires this event.
  • Interface :{{ domxref('CompositionEvent') }}
  • Synchronicity :synchronous
  • Bubbles : yes
  • Target : {{ domxref('Element') }}
  • Cancelable : no
  • Default action : {{ domeventxref("textinput") }} event (but see browser-specific notes)

Specification

DOM Level3 Events

Browser compatibility

{{ CompatibilityTable() }}

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support {{ CompatUnknown() }} {{ CompatGeckoDesktop("9.0") }} {{ CompatUnknown() }} {{ CompatUnknown() }} {{ CompatUnknown() }}
Default action ({{ domeventxref("textinput") }} event {{ CompatUnknown() }}

{{ unimplemented_inline("622245") }}

{{ CompatUnknown() }} {{ CompatUnknown() }} {{ CompatUnknown() }}
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support {{ CompatUnknown() }} {{ CompatGeckoMobile("9.0") }} {{ CompatUnknown() }} {{ CompatUnknown() }} {{ CompatUnknown() }}
Default action ({{ domeventxref("textinput") }} event {{ CompatUnknown() }}

{{ unimplemented_inline("622245") }}

{{ CompatUnknown() }} {{ CompatUnknown() }} {{ CompatUnknown() }}

Revision Source

<p>The DOM <code>compositionstart</code> event is fired synchronously when composed text is committed, such as when the user tells the IME they're finished editing text. It's represented by the {{ domxref("CompositionEvent") }} interface.</p>
<div class="note"><strong>Note:</strong> This event should handle starting the text composition system, but in Gecko it's the other way around; when the system starts its composition system, Gecko fires this event.</div>
<ul style="display:table;padding: 0;border-left: 2px solid;margin-left:0.5em;"> <li style="display:table-row;padding: 3px;margin:0;"><dfn style="display:table-cell;padding: 0 5px;border-bottom: none;cursor:inherit;">Interface :</dfn>{{ domxref('CompositionEvent') }}</li> <li style="display:table-row;padding: 3px;margin:0;"><dfn style="display:table-cell;padding: 0 5px;border-bottom: none;cursor:inherit;">Synchronicity :</dfn>synchronous</li> <li style="display:table-row;padding: 3px;margin:0;"><dfn style="display:table-cell;padding: 0 5px;border-bottom: none;cursor:inherit;">Bubbles :</dfn> yes</li> <li style="display:table-row;padding: 3px;margin:0;"><dfn style="display:table-cell;padding: 0 5px;border-bottom: none;cursor:inherit;">Target :</dfn> {{ domxref('Element') }}</li> <li style="display:table-row;padding: 3px;margin:0;"><dfn style="display:table-cell;padding: 0 5px;border-bottom: none;cursor:inherit;">Cancelable :</dfn> no</li> <li style="display:table-row;padding: 3px;margin:0;"><dfn style="display:table-cell;padding: 0 5px;border-bottom: none;cursor:inherit;">Default action :</dfn> {{ domeventxref("textinput") }} event (but see browser-specific notes)</li>
</ul>
<h2>Specification</h2>
<p><a class="external" href="http://dev.w3.org/2006/webapi/DOM-Level-3-Events/html/DOM3-Events.html#event-type-compositionstart" title="http://dev.w3.org/2006/webapi/DOM-Level-3-Events/html/DOM3-Events.html#event-type-compositionstart">DOM Level3 Events</a></p>
<h2>Browser compatibility</h2>
<p>{{ CompatibilityTable() }}</p>
<div id="compat-desktop"> <table class="compat-table"> <tbody> <tr> <th>Feature</th> <th>Chrome</th> <th>Firefox (Gecko)</th> <th>Internet Explorer</th> <th>Opera</th> <th>Safari</th> </tr> <tr> <td>Basic support</td> <td>{{ CompatUnknown() }}</td> <td>{{ CompatGeckoDesktop("9.0") }}</td> <td>{{ CompatUnknown() }}</td> <td>{{ CompatUnknown() }}</td> <td>{{ CompatUnknown() }}</td> </tr> <tr> <td>Default action ({{ domeventxref("textinput") }} event</td> <td>{{ CompatUnknown() }}</td> <td> <p>{{ unimplemented_inline("622245") }}</p> </td> <td>{{ CompatUnknown() }}</td> <td>{{ CompatUnknown() }}</td> <td>{{ CompatUnknown() }}</td> </tr> </tbody> </table>
</div>
<div id="compat-mobile"> <table class="compat-table"> <tbody> <tr> <th>Feature</th> <th>Android</th> <th>Firefox Mobile (Gecko)</th> <th>IE Mobile</th> <th>Opera Mobile</th> <th>Safari Mobile</th> </tr> <tr> <td>Basic support</td> <td>{{ CompatUnknown() }}</td> <td>{{ CompatGeckoMobile("9.0") }}</td> <td>{{ CompatUnknown() }}</td> <td>{{ CompatUnknown() }}</td> <td>{{ CompatUnknown() }}</td> </tr> <tr> <td>Default action ({{ domeventxref("textinput") }} event</td> <td>{{ CompatUnknown() }}</td> <td> <p>{{ unimplemented_inline("622245") }}</p> </td> <td>{{ CompatUnknown() }}</td> <td>{{ CompatUnknown() }}</td> <td>{{ CompatUnknown() }}</td> </tr> </tbody> </table>
</div>
Revert to this revision