107

ctrlこのコードを使用して、JavaScriptで+zキーの組み合わせをキャプチャしようとしています:

<html>
<head>
    <title>Untitled Document</title>
</head>
<body>

    <script type='text/javascript'>
        function KeyPress(e) {
            var evtobj = window.event? event : e


            //test1 if (evtobj.ctrlKey) alert("Ctrl");
            //test2 if (evtobj.keyCode == 122) alert("z");
            //test 1 & 2
            if (evtobj.keyCode == 122 && evtobj.ctrlKey) alert("Ctrl+z");
        }

        document.onkeypress = KeyPress;
    </script>

</body>
</html>

ctrlキーを押したまま他のキーを押すと、コメント行「test1」でアラートが生成されます。

キーを押すと、コメント行「test2」でアラートが生成されzます。

「test 1 & 2」の後の行に従ってそれらをまとめ、ctrlキーを押したままキーを押してもz、期待どおりにアラートが生成されません。

コードの何が問題になっていますか?

4

8 に答える 8

115
  1. onkeydown(または)を使用し、使用onkeyupしないonkeypress
  2. keyCode122 ではなく 90 を使用

オンライン デモ: http://jsfiddle.net/29sVC/

明確にするために、キーコードは文字コードと同じではありません。

文字コードはテキスト用です（エンコーディングによって異なりますが、多くの場合、0～127 は ASCII コードのままです）。キー コードは、キーボードのキーにマップされます。たとえば、Unicode 文字で 0x22909 は「好」を意味します。実際にこのためのキーを持っているキーボードは (もしあれば) あまりありません。

OS は、ユーザーが構成した入力方法を使用して、キーストロークを文字コードに変換します。結果は keypress イベントに送信されます。(一方、keydown と keyup は、テキストを入力するのではなく、ユーザーがボタンを押すことに応答します。)

于 2013-04-15T02:04:22.843 に答える
83

この質問に出くわした将来の人々のために、仕事を成し遂げるためのより良い方法があります：

document.addEventListener('keydown', function(event) {
  if (event.ctrlKey && event.key === 'z') {
    alert('Undo!');
  }
});

を使用event.keyすると、コードが大幅に簡素化され、ハードコードされた定数が削除されます。IE 9+ をサポートしています。

さらに、を使用document.addEventListenerすると、同じイベントに対して他のリスナーを壊すことがなくなります。

最後に、 を使用する理由はありませんwindow.event。これは積極的に推奨されておらず、壊れやすいコードになる可能性があります。

于 2019-05-23T00:11:17.807 に答える
6 
$(document).keydown(function(e){
  if( e.which === 89 && e.ctrlKey ){
     alert('control + y'); 
  }
  else if( e.which === 90 && e.ctrlKey ){
     alert('control + z'); 
  }          
});

デモ

于 2015-11-09T12:40:23.120 に答える
3

90 がZ鍵であり、これで必要なキャプチャが行われます...

function KeyPress(e){
     // Ensure event is not null
     e = e || window.event;

     if ((e.which == 90 || e.keyCode == 90) && e.ctrlKey) {
         // Ctrl + Z
         // Do Something
     }
}

要件によっては、if ステートメント内に を追加してe.preventDefault();、カスタム機能を排他的に実行することができます。

于 2014-08-01T12:48:55.697 に答える