web-dev-qa-db-ja.com

jQueryでクリックイベント中にキーが押されたかどうかを確認するにはどうすればよいですか？

JQueryでクリックイベントをキャッチし、同時にキーが押されたかどうかを確認できるようにして、keypressイベントに基づいてコールバック関数内で分岐できるようにします。

例：

$("button").click(function() {
    if([KEYPRESSED WHILE CLICKED]) {
        // Do something...
    } else {
        // Do something different...
    }
});

これはまったく可能ですか、可能であればどのように行うことができますか？

jqueryeventskeyboardclick
101
daniel smith

イベントプロパティからshift、alt、controlキーを簡単に検出できます。

$("button").click(function(evt) {
  if (evt.ctrlKey)
    alert('Ctrl down');
  if (evt.altKey)
    alert('Alt down');
  // ...
});

その他のプロパティについては、 quirksmode を参照してください。他のキーを検出する場合は、 cletus's answer を参照してください。

170
kkyy

keydown() および keyup() を使用して、キーステータスを個別に追跡する必要があります。

var ctrlPressed = false;
$(window).keydown(function(evt) {
  if (evt.which == 17) { // ctrl
    ctrlPressed = true;
  }
}).keyup(function(evt) {
  if (evt.which == 17) { // ctrl
    ctrlPressed = false;
  }
});

キーコードのリスト を参照してください。これで確認できます：

$("button").click(function() {
  if (ctrlPressed) {
    // do something
  } else {
    // do something else
  }
});
47
cletus

JavaScriptのみで使用できました

 <a  href="" onclick="return Show(event)"></a>

  function Show(event) {
            if (event.ctrlKey) { 
                 alert('Ctrl down');
            }
     }
8
Arun Prasad E S

@ Arun Prasad's thunder を盗むことなく、ここにデフォルトのアクションを停止するために再ハッシュした純粋なJSスニペットがあります。

function Show(event) 
{
  if (event.ctrlKey) 
  {
    alert('Ctrl held down which clicked');
  } 
  else 
  {
    alert('Ctrl NOT pressed');
  }
  return false
}
<p>Hold down CTL on the link to get a different message</p>

<a href="" onclick="return Show(event)">click me</a>
3
vr_driver