Javascript/jQuery Keypress logging

Question

Я хотел бы иметь возможность регистрировать нажатия клавиш на определенной странице, пытаясь реализовать функциональность типа «Пасхальное яйцо», где, когда правильные клавиши будут нажаты в правильном порядке, это вызывает и событие.

Может ли кто-нибудь дать мне какие-либо указатели?

Answer 1

Ну, хотя другой ответ принят, я все равно отправлю его туда.

$(document).ready(function() { 

    var easterEgg = 'egg'; 
    var eggLength = easterEgg.length; 
    var keyHistory = ''; 
    var match; 
     $(document).keypress(function(e) { 
      keyHistory += String.fromCharCode(e.which) 
      match = keyHistory.match(easterEgg); 
      if(match) { 
       alert(match); 
       keyHistory = match = ''; 
      } else if (keyHistory.length > 30) { 
       keyHistory = keyHistory.substr((keyHistory.length - eggLength - 1)); 
      } 
     }); 
}); 

Когда вы в конечном счете типа «яйцо» (для этого примера), вы получите предупреждение, а ключ истории сбросит.

EDIT:Обновлен код, чтобы усечь строку, если она слишком длинная.

Answer 2

Я использовал этот код для использования стрелок вверх/вниз для прокрутки списка, это должно быть относительно легко расширить это, чтобы проверить определенную комбинацию клавиш.

$("#SearchInput").keydown(function(e){ 
    switch(e.which) { 
    // User pressed "up" arrow 
    case 38: 
     navigate('up'); 
    break; 
    // User pressed "down" arrow 
    case 40: 
     navigate('down'); 
    break; 
    // User pressed "enter" 
    case 13: 
     if(currentUrl != '') { 
      window.location = currentUrl; 
     } 
    break; 
    } 

Answer 3

Использование jQuery:

$(document).keyup(function(e) { 
    if (e.keyCode == 27) { 
     alert("You pressed escape"); 
    } 
}); 

Это захватывает нажатия клавиш на всю страницу не только конкретный элемент.

This blog post подробная информация о том, как захватить CTRL + клавиши быстрого доступа.

Answer 4

Я не уверен в точных кодах нажатия клавиши, я заимствован из ответа Ханса Кова. Я бы использовал массив вроде стека и просто нажимал новое нажатие на стек, а затем всплывал, чтобы проверить правильный порядок.

<script type="text/javascript> 

var keypresses = []; 
    $(document).ready(function() { 
    body.bind('keypress', function(event) { 
     switch(event.keyCode) { 
     case 40: 
      keypresses.push('down'); 
     break; 
     case 38: 
      keypresses.push('up'); 
     } 

     checkForEasterEgg(keypresses); 
    }); 
    }); 

    function checkForEasterEgg(keyArray) { 
    var length = keyArray.length; 
    for(var i = 0; i < length; i++) { 
     // using keyArray.pop(), check if order matches up up down down left right left right b a 
     if (easterEggPassed) { 
     console.log('30 lives, woohoo!'); 
     } 
    } 
    } 
</script> 

Answer 5

В таких обстоятельствах также может быть полезно, чтобы иметь возможность проверить на CTL/альт/смены ключей:

if (e.altKey) { 
} 

if (e.ctrlKey) { 
} 

if (e.shiftKey) { 
} 

Для коды нажатия клавиш, следующий объект буквальным должно помочь:

var Key = 
{ 
    BACKSPACE: 8, 
    TAB: 9, 
    ENTER: 13, 
    ESC: 27, 
    PAGEUP: 33, 
    PAGEDOWN: 34, 
    END: 35, 
    HOME: 36, 
    LEFT: 37, 
    UP: 38, 
    RIGHT: 39, 
    DOWN: 40, 
    HELP: 47, 
    H: 72, 
    K: 75, 
    N: 78, 
    R: 82, 
    NUMERIC_PLUS: 107, 
    F1: 112, 
    F2: 113, 
    F3: 114, 
    F4: 115, 
    F5: 116, 
    F6: 117, 
    F7: 118, 
    F8: 119, 
    F9: 120, 
    F10: 121, 
    F11: 122, 
    F12: 123, 
    PLUS: 187, 
    MINUS: 189, 
    V: 86 
} 

Таким образом, вместо:

switch(event.keyCode) { 
    case 40: 
     keypresses.push('down'); 
    break; 
    case 38: 
     keypresses.push('up'); 
    } 

Мы можем сказать:

switch(event.keyCode) { 
    case Key.DOWN: 
     keypresses.push('down'); 
     break; 
    case Key.UP: 
     keypresses.push('up'); 
     break; 
} 

Это способствует самодокументируемому коду и является более читабельным и обслуживаемым.

Answer 6

вот простой способ потребовать, чтобы клавиша ctrl удерживалась, когда пользователь вводит последовательность символов. немного легче, чем некоторые из ответов. в приведенном ниже случае нажатие и удерживание клавиши ctrl при вводе «quack» (без кавычек) вызовет предупреждение. кто-нибудь, когда-нибудь.

 var easterEgg = [81, 85, 65, 67, 75]; //quack 
    var eggLength = easterEgg.length; 
    var currentPosition = 0; 
    $(document).keydown(function (e) { 
     if (e.ctrlKey && e.keyCode == easterEgg[currentPosition]) { 
      e.preventDefault(); 
      if (++currentPosition == eggLength) { 
       currentPosition = 0; 
       alert('oh yeah, right there'); 
      } 
     } else { 
      currentPosition = 0; 
     } 
    }); 

Answer 7

Это может быть?

var seq = "rainbow" 
var input = "" 
window.addEventListener("keypress", function(e) { 
    input += String.fromCharCode(e.keyCode) 

    for (var i = 0; i < seq.length; i++) { 
     if (input[i] != seq[i] && input[i] != undefined) { 
      input = "" 
     } 
    } 

    if (input == seq) { 
     alert("EASTER EGG!") 

     input = "" 
    } 
})