79

jQuery で矢印キーの押下をキャプチャしようとしていますが、イベントがトリガーされていません。

$(function(){
    $('html').keypress(function(e){
        console.log(e);
    });
});

これは英数字キーのイベントを生成しますが、削除、矢印キーなどはイベントを生成しません。

それらをキャプチャしないために何が間違っていますか?

4

6 に答える 6

189

キータイプの使用をキャッチするために、「矢印」を無視する.keydown()ため、使用する必要があります.keypress()e.which

結果画面を押してフォーカスし (フィドル画面の右下)、矢印キーを押して動作を確認します。

ノート:

  1. .keypress()Shift、Esc、および Delete で起動されることはありませんが、発生します.keydown()
  2. 実際.keypress()には一部のブラウザーでは矢印キーでトリガーされますが、クロスブラウザーではないため、より信頼性が高く使用できます.keydown()

より役立つ情報

  1. .whichイベント オブジェクトのOrを使用でき.keyCodeます - 一部のブラウザーはいずれかをサポートしませんが、jQuery を使用する場合は、jQuery が物事を標準化するため、両方を安全に使用できます。(私は問題がなかったことが好き.whichです)。
  2. 実際にキャプチャされたキーでの押下を検出するctrl | alt | shift | METAには、イベント オブジェクトの次のプロパティを確認する必要があります。それらが押下された場合は TRUE に設定されます。
  3. 最後に、いくつかの便利なキー コードを示します (完全なリストについては、keycode-cheatsheet )。

    • 入力: 13
    • アップ: 38
    • 下:40
    • 右: 39
    • 左: 37
    • エスケープ: 27
    • スペースバー: 32
    • コントロール: 17
    • アルト: 18
    • シフト: 16
于 2013-10-13T16:16:13.577 に答える
28
$(document).keydown(function(e) {
    console.log(e.keyCode);
});

Keypress イベントは矢印キーを検出しますが、すべてのブラウザーで検出されるわけではありません。したがって、キーダウンを使用することをお勧めします。

これらは、コンソール ログで取得する必要があるキーコードです。

  • 左 = 37
  • アップ = 38
  • 右 = 39
  • ダウン = 40
于 2013-10-13T16:13:55.617 に答える
9

矢印キーが押されているかどうかは、次の方法で確認できます。

$(document).keydown(function(e){
    if (e.keyCode > 36 && e.keyCode < 41) 
      alert( "arrowkey pressed" );          
});

jsfiddle デモ

于 2014-12-18T03:18:51.157 に答える
2

JQueryからのリンクを参照してください

http://api.jquery.com/keypress/

それは言う

keypress イベントは、ブラウザーがキーボード入力を登録するときに要素に送信されます。これは keydown イベントに似ていますが、Shift、Esc、delete などの修飾キーと非印刷キーは keydown イベントをトリガーしますが、keypress イベントはトリガーしません。プラットフォームとブラウザーによっては、2 つのイベント間のその他の違いが生じる場合があります。

つまり、矢印の場合はキープレスを使用できません。

于 2014-07-24T16:32:15.140 に答える