使用Javascript检测按键组合系列

Question

对于复活节假期，我想在我开发的网站上有一个小小的惊喜“复活节彩蛋狩猎”。这五个中的两个复活节彩蛋我隐藏的将是按键命令。这不会像“同时按下CTRL和TAB”类型的交易，而是一个“Pres UP三次，然后三次右”类型的事情。这将寻找一系列按键，而不是一次只按两次。我已经设置了这个功能，但出于某种奇怪的原因，它不能像它应该那样工作。

注：下面的脚本寻找以下按键台系列：
surprise1 - LEFT（三次），RIGHT（三次），UP（三次），DOWN（X3）
surprise2 - SHIFT（X3） ，TAB（x3），CTRL（x3）

$(document.body).keydown(function(e) { 
      surprise1(e); 
      surprise2(e); 
}); 

function surprise1(e) { 
    var ev = (e) ? e : window.event; 
    var k = ev.keyCode; 
    if (k > 36 && k < 41) { 
     typekeys[k] = isNaN(typekeys[k]) ? 0 : typekeys[k]; 
     typekeys[k]++; 
     if (typekeys[37] == 3) { 
      if (typekeys[37] == 3 && typekeys[39] == 3) { 
       if (typekeys[37] == 3 && typekeys[39] == 3 && typekeys[38] == 3) { 
        if (typekeys[37] == 3 && typekeys[39] == 3 && typekeys[38] == 3 && typekeys[40] == 3) { 
         alert("You've found Surprise 1! Contact the site admin ASAP to get your prize!"); 
         typekeys[37] = typekeys[39] = typekeys[38] = typekeys[40] = 0; 
        } 
       } else { 
        typekeys[40] = 0; 
       } 
      } else { 
       typekeys[38] = typekeys[40] = 0; 
      } 
     } else { 
      if (typekeys[37] > 3) { 
       typekeys[37] = 0; 
      } 
      typekeys[39] = typekeys[38] = typekeys[40] = 0; 
     } 
    } else { 
     typekeys[37] = typekeys[39] = typekeys[38] = typekeys[40] = 0; 
    } 
}; 

function surprise2(e) { 
    var ev = (e) ? e : window.event; 
    var k = ev.keyCode; 
    if (k > 8 && k < 18) { 
     typekeys[k] = isNaN(typekeys[k]) ? 0 : typekeys[k]; 
     typekeys[k]++; 
     if (typekeys[16] == 3) { 
      if (typekeys[9] == 3) { 
       if (typekeys[16] == 3 && typekeys[9] == 3 && typekeys[17] == 3) { 
        alert("You've found Surprise 2! Contact the site admin ASAP to get your prize!"); 
        typekeys[16] = typekeys[9] = typekeys[17] = 0; 
       } 
      } 
     } else { 
      if (typekeys[16] > 3) { 
       typekeys[16] = 0; 
      } 
      typekeys[9] = typekeys[17] = 0; 
     } 
    } else { 
     typekeys[16] = typekeys[9] = typekeys[17] = 0; 
    } 
}; 

请正确告诉我为什么这不起作用？在我看来，它应该工作。

Answer 1

试试这个：我使用https://github.com/madrobby/keymaster jQuery插件

$(function() { 
    var combination = '' 
    key('left', function(){ 
     combination = 'left'; 
     checkCombination(); 
    }); 
    key('right', function(){ 
     combination+= 'right'; 
     checkCombination(); 
    }); 
    key('up', function(){ 
     combination+= 'up'; 
     checkCombination(); 
    }); 
    key('down', function(){ 
     combination+= 'down'; 
     checkCombination(); 
    }); 

    function checkCombination() { 
     if(combination === 'leftrightupdown') { 
     alert('surprise 1'); 
     } 
    } 
});​ 

演示：http://jsfiddle.net/codef0rmer/BSdCq/

Answer 2

这里是我的解决方案。我不得不做一些有趣的东西来比较here所描述的阵列。我敢肯定，你能适应这个脚本的一般要点，以满足您的需求....

var seqs = [ [37,37,37,38,38,38,39,39,39,40,40,40], [9,9,9,16,16,16,17,17,17] ]; 
var seq = []; 

var messages=["You've found Surprise 1! Contact the site admin ASAP to get your prize!", "You've found Surprise 2! Contact the site admin ASAP to get your prize!"]; 

window.addEventListener("keydown", function(e){ 
    seq.push(e.keyCode); 
    var eq = function(a,b){ return !(a<b || b<a); }; 
    for (var i = 0; i < seqs.length; i++) { 
     if (eq(seq, seqs[i].slice(0,seq.length))) { 
      if (eq(seq, seqs[i])) { 
      alert(messages[i]); 
      seq = []; 
      } 
     return; 
     } 
    } 
    seq = []; 
}); 

Answer 3

这是更好的：

$(function() { 
    var combination = '' 
    key('left', function(){ 
    combination = 'left'; 
    checkCombination(); 
}); 
key('right', function(){ 
    combination+= 'right'; 
    checkCombination(); 
}); 
key('up', function(){ 
    combination+= 'up'; 
    checkCombination(); 
}); 
key('down', function(){ 
    combination+= 'down'; 
    checkCombination(); 
}); 

key(!'down' && !'left' && !'right' && !'up',function() { 
    combination = ''; 
}); 

function checkCombination() { 
    if(combination === 'leftrightupdown') { 
    alert('surprise 1'); 
    } 
} 
}); 

Answer 4

以下是我解决了这一...

var nums = [38, 38, 40, 40, 37, 39, 37, 39, 66, 65]; 
var n = nums.slice(); 
$(document).keydown(function(e){ 
    if(e.which == n[0]){ 
    n.shift(); 
    } else n = nums.slice(); 
    if(n.length == 0) { 
    //success! 
    n = nums.slice(); 
    } 
}); 

如果你知道序列是什么的话。 ;）