JavaScript でキーの同時押しを検出するにはどうすればよいですか?

JavaScript での複数のキーの同時押しの検出

JavaScript では、複数のキーが同時に押されたかどうかを次の手順で判断できます。

1. 「マップ」と呼ばれる JavaScript 配列を作成するか、 object.

2. keydown および keyup イベント リスナー内で、「マップ」配列を操作します。

   • キーが押されたとき (keydown イベント)、対応するキー コードを設定します。
   • キーが放されたとき (keyup イベント)、配列内の対応するキー コードまたはキーを設定します。
3. 「map」配列を利用して、その配列を評価することで特定のキーの組み合わせをチェックします。

例

// Create an array to track key presses
var map = {};

// Add event listeners for keydown and keyup events
document.addEventListener("keydown", function(e) {
  map[e.keyCode] = true;
});
document.addEventListener("keyup", function(e) {
  map[e.keyCode] = false;
});

// Check for key combinations using the map array
if (map[17] && map[16] && map[65]) {
  console.log("Ctrl + Shift + A pressed");
}

使用法

• このスクリプトは、マップ配列を次のように初期化します。
• ユーザーがキーを押したとき「A」キー、「map[65]」要素は「true」（Ctrl の場合は 17、Shift の場合は 16、A の場合は 65）に設定されます。map = { 17: true, 16: true, 65: true }.
• ユーザーが複数のキーを押すと、配列内の対応する要素がそれに応じて設定されます。
• 特定のキーの組み合わせを検出するには、を参照してください。スクリプト内の「if」条件。「Ctrl Shift A」の組み合わせをチェックします。

重要な注意事項

• keyCode の非推奨: Event.keyCode は非推奨になりました。代わりに、event.key などの代替アプローチを使用する必要があります。
• イベント処理に関する考慮事項: 使用されているイベント処理メカニズム (element.onkeydown と element.addEventListener など) には異なる機能が提供されるため、注意してください。
• ブラウザのデフォルト: 特定のキーの組み合わせには、デフォルトのブラウザ動作がある場合があります。これらのアクションを防ぐには、event.preventDefault() または return false の使用を検討してください。
• return または e.preventDefault() を使用してイベント ハンドラーを終了する場合は、イベント処理とコードの実行に異なる影響を与えるため、注意してください。
• より包括的な機能が必要な場合は、ヘルパー クラスを作成するか、宣言型プログラミングを利用して、よりクリーンで管理しやすいアプローチを実現できます。

以上がJavaScript でキーの同時押しを検出するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。