Keyboard Key Code Viewer
キーを押してJavaScriptのKeyCodeを取得
イベントプロパティ
最近の履歴
おすすめのツール
役に立つかもしれない厳選されたツール
任意のキーのJavaScriptキーコードを調べる
概要
ウェブでキーボード操作を作るとき、キー押下がどんな値を生むか — `key`・`code`・旧来の`keyCode` — を正確に知る必要があります。キーコードビューアはこれをライブで表示します。任意のキーを押すと、JavaScriptが見る識別子を示します。このツールはブラウザ内でキーイベントを捉え、当てずっぽうなしにショートカットやハンドラを組めます。
使い方(ステップ)
- 1
ツールにフォーカスしてキーを押す
ビューアをクリックし、検査したい任意のキーや組み合わせを押します。
- 2
識別子を読む
`key`・`code`・`keyCode`、そしてどの修飾キーが押されていたかを見ます。
- 3
適切なプロパティを使う
ハンドラに合う値をコピーします。文字は通常`key`、物理キー位置は`code`。
仕組み
ツールはキーボードイベントを監視し、キーを押すとイベントのプロパティを読みます。`key`('a'や'Enter'などの文字・名前)、`code`('KeyA'などの物理キー)、数値の`keyCode`(非推奨だがまだ見られる)、修飾状態(Shift・Ctrl・Alt・Meta)。これらを即座に表示します。すべてブラウザ内でローカルに動き、押したキーは記録も送信もされません。
こんなときに使う
キーボードショートカットを作り、一致に必要な正確な`key`や`code`が要るとき。特定のキーでハンドラが発火しない理由をデバッグするとき。レイアウト間で同じ文字を共有するキーを区別するとき。ショートカット用の修飾キーの組み合わせを検出するとき。`key`・`code`・`keyCode`の違いを学ぶとき。特殊・メディアキーが何を報告するか確認するとき。
よくある質問
`key`は生成された値で、レイアウトと修飾キーの影響を受けます(Shift+aは'A')。`code`は物理キー位置でレイアウトに影響されません(そのキーは常に'KeyA')。文字には`key`、WASDのような物理位置ショートカットには`code`を使います。
注意事項
一部のキーはブラウザ・OS・キーボードレイアウトで挙動が異なります。特にデッドキー、IME入力、メディアキー。1台の値がどこでも通用すると仮定せず、対象プラットフォームでテストしてください。