jQuery检测键击并相应地设置变量

时间:2010-03-02 15:00:47

标签: jquery variables reset keystroke

我已经在我的代码中创建了一个基本的EasterEgg,以便在使用以下代码进行以下击键(不是同时)Enter + c + o + l + o + r + s时激活:

isEnter = 0; isC = 0; isO = 0; isL = 0; isR = 0; isS = 0;
$(window).keydown(function(e){
    if(e.which==13) isEnter = 1; if(e.which==67) isC = 1; if(e.which==79) isO = 1; 
    if(e.which==76) isL = 1; if(e.which==82) isR = 1; if(e.which==83) isS = 1;
    ColorMap();
});

function ColorMap(){
  if(isEnter==1 && isC==1 && isO==1 && isL==1 && isR==1 && isS==1){
     //DO FUNCTION//
     isEnter = 0; isC = 0; isO = 0; isL = 0; isR = 0; isS = 0; //SET VARS BACK TO 0
  };
};

我需要在keydown函数中添加重置功能,以便在按下除了这些键之外的其他内容时重置所有变量...这样他们必须按Enter + c + o + l + o + r + s或者语句被重置并且必须重新开始...(这将使'EasterEgg'难以达到[或至少不太可能通过侥幸或随机击键获得]。)

4 个答案:

答案 0 :(得分:13)

您也想按顺序检查这些内容。现在,你可以按任意顺序按键,然后激活复活节彩蛋。例如Enter + lorocs

我会按顺序存储您要查找的值,如下所示:

//       Enter, c, o, l, o, r, s
var keys = [13,67,79,76,79,82,83];

然后,您可以跟踪用户在序列中的位置:

var nextKey = 0;
$(window).keydown(function(e){
    var key = e.which;
    if (key === keys[nextKey])
        nextKey++;

    ColorMap();
});

每次匹配序列中要查找的下一个键时,这将增加nextKeynextKey变量从0索引开始,这意味着我们开始寻找Enter。现在,我们需要检查ColorMap函数中的结束条件。

function ColorMap() {
  var maxKeyIndex = keys.length - 1;
  if(nextKey >= maxKeyIndex) {
     //DO FUNCTION//

     nextKey = 0;
  }
}

此解决方案应允许您更改keys变量中的特殊序列,而无需在代码中的其他位置进行更改。

修改 如果您希望答案是连续的,那么您可以在匹配失败时重置nextKey变量。

if (key === keys[nextKey])
    nextKey++;
else
    nextKey = 0;

要获得额外的功劳,您可以将其切换为使用字符串来保存复活节彩蛋,然后String.fromCharCode将其转换为e.which返回的字符代码。

答案 1 :(得分:3)

我最近回答了类似的复活节彩蛋问题,所以我只想指出那个问题。

您正在做的事情需要采用不同的方法,而不需要重置。

Javascript/jQuery Keypress logging

编辑:这是一个更新版本,可以防止密钥历史记录过长。

$(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));
            }
        });
});

答案 2 :(得分:0)

目前你要让你的用户按任意顺序按下魔术键,这不会很有趣。我将魔术序列放入一个数组中,并且当成功的击键匹配时,您将在数组中向前移动。如果你到了最后,那就是蛋时间。

完全像@EndangeredMassa写的那样

编辑

答案 3 :(得分:0)

这是另一种方法:

<script type="text/javascript">
$(function() {
  $(window).keypress(function(e) {
    var input = $("#input");
    input.val(function(i, v) { return v + String.fromCharCode(e.which) });

    if(input.val().indexOf('colors') > -1) {
      alert('Easter Egg');
      input.val('');
    } 
    else if('colors'.indexOf(input.val())) {
      //Clear value, they've hit another key
      input.val('');
    }        
  });
 });
</script>
<input id="input" type="text" />

它会跟踪您在文本框中输入的当前部分颜色,便于调试,只需在完成测试后添加style="display: none;"