フォームの Enter 送信で isComposing と keyCode === 229 を併用する理由

IME の変換確定に使う Enter キーで、書きかけのメッセージが送信されることがあります。isComposing と非推奨の keyCode === 229 を併用して、変換中の Enter を送信処理から除外する理由を解説します。 チャット UI などで Enter キーを押したらメッセージを送信する機能を実装するとき、IME を利用するユーザーへの配慮が必要です。日本語や中国語などの入力では、文字を組み立てるために変換候補を選んでから Enter キーで確定します。単純に event.key === "Enter" だけで送信すると、ユーザーは文字を確定したつもりなのに、書きかけのメッセージが送られてしまいます。 変換を確定するつもりで押した Enter キーによって、書きかけのメッセージがそのまま送信されてしまっています。 この問題への対策として、次のようなコードを見かけることが

[amamako]

そもそもEnter押したときに勝手に送信するのやめてほしい／非推奨のものを使わなきゃ実装できない場合は「そもそもその機能を実装すべきか」を考えたほうがいい

[nguyen-oi]

SafariのIME周りの挙動はいまだに開発者を苦しめ続けてるのほんと草。フォームの暗黙的送信に寄せるのが一番平和だな

[mkusaka]

IMEの変換確定Enterで誤送信を防ぐため、isComposingとkeyCode===229を併用しSafari対策も解説。