キー入力を扱う方法 [JavaScript]

イベント

• KeyboardEvent
• InputEvent
• CompositionEvent

参考：

KeyboardEvent | MDN

InputEvent | MDN

CompositionEvent | MDN

key

参考：

Keyboard イベントで押されたキーを判別するには key プロパティを使う – Qiita

DOM3 Events のキーイベント | JavaScript で遊ぶよ

KeyboardEvent.key | MDN

Key Values | MDN

shiftKey

参考：

クライアントサイド Javascript でキーイベントをとらえる – Qiita

KeyboardEvent.shiftKey | MDN

code

参考：

KeyboardEvent.code | MDN

Code Values | MDN

keyCode

**DEPRECATED**

KeyboardEvent.keyCode は非推奨。後方互換のために残されている。新しい Web アプリの開発では使用しない。

Safari では入力欄にフォーカスがある場合は IME の有効・無効に関わらず keyCode の値は 229 になる。

接続したキーボードの種類によっては keyCode はほとんど全てのキーで 0 を返すことがある。

参考：

Safari の keyCode で取得できるコードには要注意 – Qiita

押したキーのキーコードを取得 | JavaScript 逆引き (ShanaBrian Website)

keyCode 表 & 逆引き | 非実在電波少年キリウ君

KeyboardEvent.keyCode | MDN

KeyboardEvent.keyCode とは何か | WebStudio

iOS に物理キーボードをつないで keyup イベントでどのキーが up されたかを取得する – Qiita

e.keyCode in iOS Safari on keyup event – Stack Overflow

IME 使用時のキー入力イベント

参考：

IME (全角) 入力における js イベント現状調査 – Qiita

input の入力値の制御で IME 入力とかいろいろ辛かった話 – Qiita

isComposing

参考：

JavaScript とクロスブラウザでの IME event handling | たにしきんぐダム

KeyboardEvent.isComposing | MDN

InputEvent.isComposing | MDN

IME 使用時の Enter 入力

IME で入力している途中では keypress イベントは発生しない。

変換候補の決定以外の Enter 入力では keyCode=13 の keypress イベントが発生する。

参考：

JavaScript における日本語入力確定 (Enter) イベント | galife

日本語入力確定時にイベントを発生させる jQuery プラグイン | galife

入力をキャンセルする

参考：

入力変換中の全角入力をキャンセル | teratail

iOS でキーボードを閉じる

参考：

iPhone のキーボードにある「開く」ボタンを制御する方法について – Qiita

ドキュメントオブジェクト (Document)

参考：

Document: keydown イベント | MDN

Document: keyup イベント | MDN

UI Events

参考：

UI Events (Draft) | W3C

jQuery.ui.keyCode

参考：

jQuery.ui.keyCode | jQuery UI API Documentation [Official]