DOM

Element:compositionstart イベント

 編集:2022.09.26 by T.A.

[Edge]。→

IME などのテキスト変換システムが新しい変換セッションを開始した時に発生します。

例えば、このイベントはユーザーがピン音 IME を使用して漢字の入力を開始した後に発生します。

バブリング あり
キャンセル 可能
インターフェイス CompositionEvent
イベント ハンドラー プロパティ なし

HTML:

<TEXTAREA id=IdTest>ここに入力編集してみてください。</TEXTAREA>
<DIV id=IdDisp></DIV>

JavaScript:

function Job1(eve){ //FEPにより入力開始のイベントの処理:
  D=eve; //=[object]:[object CompositionEvent]
	//isTrusted=[boolean]:true
	//data=[string]:
	//initCompositionEvent=[function]:function initCompositionEvent() { [native code] }
	//view=[object]:[object Window]
	//detail=[number]:0
	//sourceCapabilities=[object]:[object InputDeviceCapabilities]
	//which=[number]:0
	//initUIEvent=[function]:function initUIEvent() { [native code] }
	//type=[string]:compositionstart
	//target=[object]:[object HTMLTextAreaElement]
	//currentTarget=[object]:null
	//eventPhase=[number]:0
	//bubbles=[boolean]:true
	//cancelable=[boolean]:true
	//defaultPrevented=[boolean]:false
	//composed=[boolean]:true
	//…
  let E=eve.target;               //イベントが起きた要素を取得。
  E.style.backgroundColor="#efe"; //表現。
  IdDisp.innerHTML=eve.data;      //記録。
}
function Job2(eve){ //FEP で入力が終わった時のイベント処理:
  DA=eve;=[object]:[object CompositionEvent]
	//isTrusted=[boolean]:false
	//data=[string]:あい
	//initCompositionEvent=[function]:function initCompositionEvent() { [native code] }
	//view=[object]:[object Window]
	//detail=[number]:0
	//sourceCapabilities=[object]:[object InputDeviceCapabilities]
	//which=[number]:0
	//initUIEvent=[function]:function initUIEvent() { [native code] }
	//type=[string]:compositionend
	//target=[object]:[object HTMLTextAreaElement]
	//currentTarget=[object]:null
	//eventPhase=[number]:0
	//bubbles=[boolean]:true
	//cancelable=[boolean]:true
	//defaultPrevented=[boolean]:false
	//composed=[boolean]:true
	//…
  let E=eve.target;               //イベントが起きた要素を取得。
  E.style.backgroundColor="#fee"; //表現。
  IdDisp.innerHTML=eve.data;      //記録。
}
IdTest.addEventListener('compositionstart', Job1);
IdTest.addEventListener('compositionend', Job2);

テスト