Pure JavaScript to detect only Ctrl+Q shortcuts

Question

I want to use shortcut to handle a task in Javascript (not JQuery or any Javascript libraries). For example, I want to use Ctrl+Q to write an alert. My issue is only to use Ctrl+Q, combination of other keys such as Ctrl+Q+other key will not handle the alert. How can I do?

document.addEventListener('keydown', function(event){
  if(event.ctrlKey && event.keyCode == 81) console.log('alert');
});

I only want Ctrl+Q work, not for Ctrl+Shift+Q, Ctrl+Alt+Q, Ctrl+Q+(some key else)

Maybe duplicate of [How to detect if multiple keys are pressed at once using JavaScript?](https://stackoverflow.com/questions/5203407/how-to-detect-if-multiple-keys-are-pressed-at-once-using-javascript) — nagataaaas, Jul 01 '19 at 03:48

score 4 · Answer 1 · answered Jul 01 '19 at 03:51

4

Just ensure none of the other three modifiers are pressed:

document.addEventListener('keydown', function(event) {
  if (event.ctrlKey && event.keyCode == 81 && !(event.shiftKey || event.altKey || event.metaKey)) console.log("alert");
});

answered Jul 01 '19 at 03:51

Jack Bashford

43,180
11
50
79

1

This isn't checking whether or not the user is also holding down another keyCode, such as Ctrl+E+Q – Seth Jul 01 '19 at 04:19
Not exactly sure how to do that @Seth. – Jack Bashford Jul 01 '19 at 04:20
Yes, I knew this way, but it is not enough. For example Ctrl+Q+A still works. I don't want to check every key. It is so strange ! – Freelancer Jul 01 '19 at 08:15

Suraj Mohata · Answer 2 · 2019-07-04T04:57:33.423

0

The code below should solve your problem(Updated Code):

document.addEventListener("keydown", function (event) {
var map = [];
  onkeyup = function(e){
    map.push(e.key);
    console.log(map);
    if(map.length == 2){
      console.log("CTRL + Q was pressed",map.indexOf("q") > -1 && map.indexOf("Control") > -1)
    }

    onkeydown = function(e){
      // console.log(map);
    }
  }


});

If any other button is pressed along with ctrl (For instance: ctrl+shift+Q or ctrl+alt+q), it returns false!! Let me know if that solves your problem. Cheers!!

edited Jul 04 '19 at 04:57

answered Jul 01 '19 at 04:14

Suraj Mohata

106
1
5

This would give a false positive if i pressed something like Ctrl+E+Q – Seth Jul 01 '19 at 04:17
This way is same to @Jack Bashford – Freelancer Jul 01 '19 at 08:17

Seth · Answer 3 · 2019-07-01T05:00:03.677

You'll need to keep track of what keys are pressed with keydown and which keys are released with keyup, then, when a new key is pressed, you would check for only Ctrl and Q currently being down.

Something like this should work:

var keysPressed = [];

function onPressOrRelease(event) {
  if (event.type === "keydown") {
    if (!keysPressed.includes(event.keyCode))
      keysPressed.push(event.keyCode)
  } else if (event.type === "keyup")
    keysPressed.splice(keysPressed.indexOf(event.keyCode), 1);

  let ctrlQPressed = keysPressed.includes(81) && keysPressed.includes(17) && !keysPressed.some(a => a !== 81 && a !== 17)
  if (ctrlQPressed)
    console.log("pressed");
}

document.addEventListener("keydown", onPressOrRelease);
document.addEventListener("keyup", onPressOrRelease);

You'll want to make sure keys don't get added multiple times and may want to clear the array on focus loss (since using control it may lose focus when releasing)

I'm not sure why someone thought this was worthy of a down vote but I'm pretty sure this is the only way to tell for instance that someone isn't holding down 'Q+E+Ctrl' or any other combo of Ctrl+Q+(some key else) as requested in the question — Seth, Jul 01 '19 at 04:13

Pure JavaScript to detect only Ctrl+Q shortcuts

3 Answers3