Marco Larrauri
Marco Larrauri

Reputation: 1

Triggering Alert only if 4 particular keys are pressed: e.g. if 4 3 5 2 keys are pressed in that order the alert triggers

I need to create an event that triggers only after four keys in a specific order are pressed. I'm not an expert on jquery, is it possible to do this?

I already know how to trigger the alert if 4 is pressed but i don't know how to make it happen after four keys are pressed in a particular order.

$(document).keydown(function(keyPressed) {
        if (keyPressed.keyCode == 52) {
            alert("Hello!");
        }
    });

Upvotes: 0

Views: 28

Answers (2)

connexo
connexo

Reputation: 56793

Using good old plain vanilla Javascript, here's a shot:

const code = "4352", sequence = [...code];
let keysPressed = [];

document.addEventListener('keydown', (event) => {
  keysPressed.push(event.key);
  if (keysPressed.every((key, index) => key === sequence[index])) {
    if (keysPressed.length === sequence.length) {
      alert('correct code entered!');
    } else { return; }
  } 
  keysPressed = [];
})

Alternative solution using only String instead of an Array:

const code = "4352";
let keysPressed = "";

document.addEventListener('keydown', (event) => {
  keysPressed += event.key;
  if (code.substr(0, keysPressed.length)===keysPressed) {
    if (keysPressed === code) {
      alert('correct code entered!');
    } else { return; }
  } 
  keysPressed = "";
})

Upvotes: 0

Will Silveira
Will Silveira

Reputation: 383

You can use like that:

var global = {

  alertTrigger: function() {
    var keysToPress = [52,51,53,50], 
        started = false, 
        count = 0;

    $(document).keydown(function(e){
      var reset = function() {
        started = false; 
        count = 0;
        return;
      };

      key = e.keyCode;

      // Begin watching if first key in sequence was pressed.
      if(!started){
        if(key == 38){
          started = true;
        }
      }

      // If we've started, pay attention to key presses, looking for right sequence.
      if (started){

        if (keysToPress[count] == key){
          count++;
        } else {
          // Incorrect key, restart.
          reset();
        }
        if (count == 10){
          // Success!
          alert('Right code entered! Do something cool here.');
          reset();
        }
      } else {
        reset();
      }
    });
  }
}

global.alertTrigger();

Upvotes: 0

Related Questions