KeyboardEvent: keyCode プロパティ

例

window.addEventListener(
  "keydown",
  (event) => {
    if (event.defaultPrevented) {
      return; // 既定のアクションがキャンセルされている場合は何もしないようにします。
    }

    let handled = false;
    if (event.key !== undefined) {
      // KeyboardEvent.key でイベントを処理し、handled を true に設定します。
      handled = true;
    } else if (event.keyCode !== undefined) {
      // KeyboardEvent.keyCode でイベントを処理し、handled を true に設定します。
      handled = true;
    }

    if (handled) {
      // イベントが処理された場合、"ダブルアクション" を抑制する
      event.preventDefault();
    }
  },
  true,
);

仕様書

ブラウザーの互換性

keyCode の値

標準位置で表示可能なキー

標準位置で表示可能なキーを押したり離したりすることで発生するキーイベントの値は、ブラウザー間で互換性がありません。

IE はネイティブの仮想キーコードの値を KeyboardEvent.keyCode として公開するだけです。

Google Chrome、Chromium、Safari は入力された文字から値を決定する必要があります。入力文字が US キーボードレイアウトで入力できる場合、 US キーボードレイアウトの keyCode 値を使用します。

Firefox は、キーによって入力可能な ASCII 文字から keyCode 値を取得します。 shift 修飾子や ASCII 対応キーボードレイアウトであった場合も含みます。詳しくは以下のルールを参照してください。

1. システムが Windows で、押されたキーのネイティブキーコードが a-z または 0-9 であることを示す場合、そのキーコードを使用します。
2. システムが Mac で、押されたキーのネイティブキーコードが 0-9 である場合、そのキーコードを使用します。
3. 押されたキーが ASCII のアルファベットまたは数字を修飾キーなしで入力する場合、それに対応するキーコードを使用します。
4. 押されたキーが、 ASCII アルファベットまたは数字を Shift キーで修飾して入力する場合、そのキーコードを使用します。
5. 押されたキーが、別の ASCII 文字を修飾キーなしで入力する場合、それに対応するキーコードを使用します。
6. 押されたキーが、別の ASCII文字を Shift キー修飾で入力する場合、それに対応するキーコードを使用します。
7. それ以外の場合、すなわち、押されたキーが Unicode 文字を入力する場合は以下の通り。
   1. キーボードレイアウトが ASCII 対応の（ASCII アルファベットを入力できる）場合、 0 を使用するか、下記の追加ルールで計算します。
   2. それ以外の場合、つまりキーボードレイアウトが ASCII に対応していない場合は、最も優先度の高い環境にインストールされている ASCII に対応したキーボードレイアウトを使用します。
      1. 代替キーボードレイアウトで押されたキーが ASCII のアルファベットまたは数字を入力する場合、そのキーコードを使用します。
      2. それ以外の場合、 0 を使用するか、下記の追加ルールで計算します。

Gecko は区切り記号キーの keyCode 値を、できる限り以下の規則で設定します（上記のリストのポイント 7.1 または 7.2 に到達したとき）。

1. macOS または Linux を使用している場合

   1. アクティブなキーボードレイアウトが ASCII に対応したものではなく、代替の ASCII 対応のキーボードレイアウトが利用可能な場合。

      1. もし、 ASCII に対応したキーボードレイアウトが、修飾されていないキーだけで ASCII 文字を生成する場合、その文字の keyCode を使用します。
      2. もし、代替の ASCII に対応したキーボードレイアウトで、 Shift キーで修飾した ASCII 文字が生成された場合、シフトされた文字の keyCodeを使用します。
      3. それ以外の場合は、 US キーボードレイアウトがアクティブなときにキーが生成する ASCII 文字を keyCode に使用します。

   2. それ以外の場合は、 US キーボードレイアウトがアクティブなときにキーが生成する ASCII 文字を keyCode に使用します。

2. Windows を使用している場合

   1. US キーボードレイアウトがアクティブなときに Windows の同じ仮想キーコードに割り当てられたキーによって生成される ASCII 文字を keyCode 値に使用します。

[1] JIS キーボードから入力される値です。 ANSI キーボードを使用すると、 US キーボードレイアウトから選択した keyCode 値と入力文字になります。

[2] このキーはデッドキーです。イベント keyup の値は 0xBA (186) です。

[3] このキーはデッドキーです。イベント keyup の値は 0x10 (16) です。

[4] キーイベントは発行されない。

[5] ギリシャ語キーボードレイアウトでは、そのキーは使用できません（いかなる文字も入力しません）。イベント keyup の値は 0x00 (0) です。

非表示キー（機能キー）

[1] Windows では、 AltGraph キーを押すと "ControlLeft" と "AltRight" の両方のキーイベントを発行します。

[2] 日本語キーボードレイアウトがアクティブである場合、 CapsLock キーを Shift なしで押すと 0xF0 (240) が発生します。このキーは Alphanumeric キー ("英数") として動作します。

[3] 日本語キーボードレイアウトがアクティブである場合、 CapsLock キーを Shift なしで押すと 0x00 (0) が発生します。このキーは Alphanumeric キー ("英数") として動作します。

[1] keypress イベントが発行され、その keyCode と charCode は 0x10 (16) になりますが、実際にはテキストはエディターに入力されません。

[2] Mac では、 Help キーは PC のキーボードの Insert キーに割り当てられています。これらの keyCode 値は Insert キーの keyCode 値と同じです。

[3] Fedora 20 でテストしました。

[4] keyup イベントのみが発生します。

[5] PC の PrintScreen, ScrollLock, Pause はそれぞれ Mac の F13, F14, F15 に割り当てられます。 Chrome と Safari はこれらを Mac のキーと同じ keyCode 値に割り当てています。

[6] Pause キーを Control 付きで推すと 0x03 (3) を生成します。

[1] Fedora 20 でテストしました。

[2] PC では、PrintScreen、ScrollLock、Pause はそれぞれ Mac の F13、F14、F15 に割り当てられています。Firefox はそれらに、PC のキーと同じ keyCode 値を設定します。

[3] Fedora 20 でテストしました。 このキーは GDK_Fxx の keysyms を発生させません。キーが適切な keysyms を発生させる場合、これらの値は IE と同じでなければなりません。

[4] Fedora 20 でテストしました。 Chromium では、このキーは DOM キーイベントを発生させません。

[5] keyUp イベントの keyCode の値は 0x83 (131) です。

[6] Fedora 20 でテストしました。 Firefox では、このキーは DOM キーイベントを発生させません。

[7] keydown イベントのみが発行されます。

[8] Firefox では、 DOM キーイベントは発行されません。

テンキー

[1] "NumLock" キーは Mac では "Clear" キーとして動作します。

keyCode 値の定数

Gecko は、対応表を明示的に作成するために、KeyboardEvent に多くの keyCode 値を定義しています。これらの値は、Firefox のアドオン開発者にとっては便利ですが、一般的なウェブページではあまり有用ではありません。

Windows の OEM 固有キー

Windows では、仮想キーコードのいくつかの値は、 OEM の特定のキー用に定義（予約）されています。これらは、非標準のキーボードの特殊なキーで利用可能です。言い換えれば、いくつかの値は、2 つ以上のベンダー（またはハードウェア）によって異なる意味で使用されています。

Gecko 21 （および 15 より古いバージョン）では、OEM 固有のキー値は Windows 上でのみ keyCode 属性で利用可能です。そのため、通常のウェブアプリケーションでは使用できません。それらはイントラネットのアプリケーション、または同様の状況においてのみ使用されます。

詳しくは MSDN の "Manufacturer-specific Virtual-Key Codes (Windows CE 5.0)" を参照してください。