EditContext
EditContext インターフェイスは、EditContext API を用いて、編集可能になった要素のテキスト編集コンテキストを表します。
EditContext API は、インプットメソッドエディター (IME) による変換、絵文字ピッカー、その他のプラットフォーム固有の編集関係の UI などの高度なテキスト入力体験に対応したリッチなテキストエディターをウェブ上で構築するのに利用できます。
対応ブラウザ
| 機能 | デスクトップ | モバイル | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
EditContext 実験的 | 121 | 121 | | | 121 | |
| CharacterBoundsUpdateEvent インターフェイスは DOM イベントで、EditContext のインスタンスに関連付けられた編集可能な領域内の特定の各文字の境界を知るためのオペレーティングシステムからの要求を表します。 | 121 | 121 | | | 121 | |
| CharacterBoundsUpdateEvent() コンストラクターは、新しい CharacterBoundsUpdateEvent オブジェクトを返します。 | 121 | 121 | | | 121 | |
rangeEnd 実験的 読み取り専用プロパティ CharacterBoundsUpdateEvent.rangeEnd は、編集可能な領域内のテキストのうち、オペレーティングシステムが境界を要求している部分の終点となる文字のオフセットを表します。 | 121 | 121 | | | 121 | |
rangeStart 実験的 読み取り専用プロパティ CharacterBoundsUpdateEvent.rangeStart は、編集可能な領域内のテキストのうち、オペレーティングシステムが境界を要求している部分の始点となる文字のオフセットを表します。 | 121 | 121 | | | 121 | |
attachedElements 実験的 EditContext インターフェイスの attachedElements() メソッドは、要素が 1 個だけ格納された Array を返します。この要素は、この EditContext オブジェクトと関連付けられた要素です。 | 121 | 121 | | | 121 | |
characterBounds 実験的 EditContext インターフェイスの characterBounds() メソッドは、この EditContext オブジェクト内の各文字を囲む長方形のリストが格納された Array を返します。 | 121 | 121 | | | 121 | |
| EditContext インターフェイスの読み取り専用プロパティ characterBoundsRangeStart は、編集可能なテキストコンテンツ内での、配列 EditContext.characterBounds() の最初の要素に対応する文字の位置を表します。 | 121 | 121 | | | 121 | |
| characterboundsupdate イベントは、オペレーティングシステムが EditContext オブジェクトの編集可能なテキスト領域内にある特定の各文字の境界を知る必要がある時発火します。 | 121 | 121 | | | 121 | |
| EditContext インターフェイスの compositionend イベントは、Input Method Editor (IME) ウィンドウを用いた変換が終了する時発火します。 | 121 | 121 | | | 121 | |
| EditContext インターフェイスの compositionstart イベントは、Input Method Editor (IME) ウィンドウを用いた変換が開始する時発火します。 | 121 | 121 | | | 121 | |
EditContext 実験的 EditContext() コンストラクターは、新しい EditContext オブジェクトを返します。 | 121 | 121 | | | 121 | |
selectionEnd 実験的 EditContext の読み取り専用プロパティ selectionEnd は、編集可能なテキストコンテンツ内での、現在選択されている範囲の終点のオフセットを表します。 | 121 | 121 | | | 121 | |
selectionStart 実験的 EditContext の読み取り専用プロパティ selectionStart は、編集可能なテキストコンテンツ内での、現在選択されている範囲の始点のオフセットを表します。 | 121 | 121 | | | 121 | |
text 実験的 EditContext インターフェイスの読み取り専用プロパティ text は、要素の編集可能なコンテンツを表します。 | 121 | 121 | | | 121 | |
| EditContext インターフェイスの textformatupdate イベントは、Input Method Editor (IME) ウィンドウを用いた変換を実行中に発火します。 | 121 | 121 | | | 121 | |
textupdate_event 実験的 EditContext インターフェイスの textupdate イベントは、ユーザーが EditContext のインスタンスに関連付けられた編集可能な領域のテキストまたは選択範囲を変更した時発火します。 | 121 | 121 | | | 121 | |
| EditContext インターフェイスの EditContext.updateCharacterBounds() メソッドは、オペレーティングシステムに EditContext オブジェクト内の各文字の位置と大きさを知らせるため、 EditContext.characterboundsupdate_event イベントへの応答として呼び出すべきです。 | 121 | 121 | | | 121 | |
| EditContext インターフェイスの EditContext.updateControlBounds() メソッドは、オペレーティングシステムに EditContext オブジェクトの編集可能なテキスト領域の位置と大きさを知らせるために使われます。 | 121 | 121 | | | 121 | |
updateSelection 実験的 EditContext インターフェイスの updateSelection() メソッドは、編集可能なテキストコンテンツ内の選択の内部状態を更新します。このメソッドは、マウスのクリックやドラッグ、およびキーボード操作など、ユーザーが EditContext に関連付けられた要素で描画されたテキストの操作を行った際に選択の状態を更新するために用いられます。 | 121 | 121 | | | 121 | |
| EditContext インターフェイスの EditContext.updateSelectionBounds() メソッドは、オペレーティングシステムに EditContext オブジェクトに関連付けられた編集可能な領域内で選択されているテキストの領域の情報を知らせます。 | 121 | 121 | | | 121 | |
updateText 実験的 EditContext インターフェイスの updateText() メソッドは、EditContext オブジェクト内部のテキストコンテンツを更新します。 | 121 | 121 | | | 121 | |
editContext 実験的 editContext は HTMLElement インターフェイスのプロパティで、要素に関連付けられた EditContext オブジェクトを取得したり設定したりします。 | 121 | 121 | | | 121 | |
TextFormat 実験的 TextFormat インターフェイスは、EditContext のインスタンスに関連付けられた編集可能なテキスト領域内のある範囲のテキストに適用するべき特定の書式を表します。このテキストの書式は、ユーザーがテキストの変換に用いている Input Method Editor (IME) からの要求です。 | 121 | 121 | | | 121 | |
rangeEnd 実験的 TextFormat インターフェイスの rangeEnd プロパティは、この書式を適用するべきテキストの範囲の終点を表します。 | 121 | 121 | | | 121 | |
rangeStart 実験的 TextFormat インターフェイスの rangeStart プロパティは、このテキストの書式を適用するべきテキストの範囲の始点を表します。 | 121 | 121 | | | 121 | |
TextFormat 実験的 TextFormat() コンストラクターは、新しい TextFormat オブジェクトを返します。 | 121 | 121 | | | 121 | |
underlineStyle 実験的 TextFormat インターフェイスの underlineStyle プロパティは、この書式を適用するテキストの範囲につけるべき下線のスタイルを表します。 | 121 | 121 | | | 121 | |
| TextFormat インターフェイスの underlineThickness プロパティは、この書式を適用するテキストの範囲につけるべき下線の太さを表します。 | 121 | 121 | | | 121 | |
| TextFormatUpdateEvent インターフェイスは DOM イベントで、EditContext のインスタンスに関連付けられた編集可能な領域内で変換中のテキストにInput Method Editor (IME) ウィンドウが適用したい書式のリストを表します。 | 121 | 121 | | | 121 | |
getTextFormats 実験的 TextFormatUpdateEvent インターフェイスの getTextFormats() メソッドは、Input Method Editor (IME) ウィンドウが変換中のテキストに適用したい書式を表す TextFormat オブジェクトの Array を返します。 | 121 | 121 | | | 121 | |
| TextFormatUpdateEvent() コンストラクターは、新しい TextFormatUpdateEvent オブジェクトを返します。 | 121 | 121 | | | 121 | |
TextUpdateEvent 実験的 TextUpdateEvent インターフェイスは DOM イベントで、EditContext のインスタンスに関連付けられた編集可能なテキスト領域内のテキストまたは選択の更新を表します。 | 121 | 121 | | | 121 | |
selectionEnd 実験的 読み取り専用プロパティ TextUpdateEvent.selectionEnd は、EditContext のオブジェクトに関連付けられた編集可能な領域のテキストコンテンツ内の選択範囲 (またはキャレット) の終点の位置を表します。 | 121 | 121 | | | 121 | |
selectionStart 実験的 読み取り専用プロパティ TextUpdateEvent.selectionStart は、EditContext のオブジェクトに関連付けられた編集可能な領域のテキストコンテンツ内の選択範囲 (またはキャレット) の始点の位置を表します。 | 121 | 121 | | | 121 | |
text 実験的 読み取り専用プロパティ TextUpdateEvent.text には、EditContext の textupdate イベントで更新された範囲に挿入されたテキストが格納されています。 | 121 | 121 | | | 121 | |
TextUpdateEvent 実験的 TextUpdateEvent() コンストラクターは、新しい TextUpdateEvent のオブジェクトを返します。 | 121 | 121 | | | 121 | |
updateRangeEnd 実験的 読み取り専用プロパティ TextUpdateEvent.updateRangeEnd は、EditContext オブジェクト内で置き換えられているテキストの範囲の終点を表します。 | 121 | 121 | | | 121 | |
updateRangeStart 実験的 読み取り専用プロパティ TextUpdateEvent.updateRangeStart は、EditContext オブジェクト内で置き換えられているテキストの範囲の始点を表します。 | 121 | 121 | | | 121 | |
実務での使いどころ
-
EditContext の活用
EditContext インターフェイスは、EditContext API を用いて、編集可能になった要素のテキスト編集コンテキストを表します。
注意点
- 一部のブラウザでのみ対応。使用前にブラウザサポートを確認すること。
実装メモ
- 一部の API はセキュアコンテキスト (HTTPS) やユーザー操作起点を必要とする。利用前に要件を確認すること。