jQuery 1.7.2 中的 Konami 代码键绑定答案

【问题标题】：Konami Code Keybinding in jQuery 1.7.2jQuery 1.7.2 中的 Konami 代码键绑定
【发布时间】：2012-07-21 14:33:57
【问题描述】：

我想实现raptorize-Plugin，但它不适用于 jQuery 1.7.2，因为我认为这部分：

else if(options.enterOn == 'konami-code'){
            var kkeys = [], konami = "38,38,40,40,37,39,37,39,66,65";
            $(window).bind("keydown.raptorz", function(e){
                kkeys.push( e.keyCode );
                if ( kkeys.toString().indexOf( konami ) >= 0 ) {
                    init();
                    $(window).unbind('keydown.raptorz');
                }
            }, true);

当我使用button-version 时，它可以工作。可能是什么问题？

【问题讨论】：

什么不起作用？您是否在屏幕上或浏览器控制台中收到错误消息？
我的浏览器控制台显示 TypeError: ((f.event.special[s.origType] || {}).handle || s.handler).apply is not a function

标签： jquery version compatibility key-bindings

【解决方案1】：

http://www.zurb.com/playground/javascripts/plugins/jquery.raptorize.1.0.js 的第 93 行上的 .bind() 使用第三个参数来防止冒泡，不知道为什么当我们在窗口上查找 keydown 事件时需要这样做，但这是在较新的 jQuery 中破坏它的原因版本。删除第三个参数，它将在 1.7.2 中工作。

还要确保您正确设置了选项，例如：

$('.myButton').raptorize({
   'enterOn' : 'konami-code'
});

【讨论】：

谢谢 Tjkoopa，但您的第三个参数是什么意思？ var kkeys = [], konami = "38,38,40,40,37,39,37,39,66,65"; $(window).bind("keydown.raptorz", function(e){ kkeys.push( e.keyCode ); if ( kkeys.toString().indexOf( konami ) >= 0 ) { init(); $(window).unbind('keydown.raptorz'); }
在 bind() 调用中，第一个参数是 'keydown.raptorz'，第二个是回调，第三个是设置 preventBubbling 的布尔值 - 删除第三个参数，它位于第 99 行。

【解决方案2】：

您可能需要考虑使用 Mousetrap 库而不是 jQuery。

上面链接的页面上甚至还有一个 Konami 代码示例，只需一行 JS 代码即可完成。

【讨论】：

【解决方案3】：

自原始 raptorize 插件发布（2010 年）以来已经有很长时间了，不幸的是，较新的 jQuery 版本打破了它。有一个更新的实现 (https://github.com/randomvlad/raptorize-jquery) 支持 jQuery 版本 1.7+、2.x 和 3.x 以及一些额外的改进。

konami-code的具体逻辑已经调整：

} else if (options.enterOn === 'konami-code') {
    var keysPressed = [];
    var konamiCode = "38,38,40,40,37,39,37,39,66,65";
    $(window).on("keydown.raptorz", function (e) {
        keysPressed.push(e.keyCode);

        if (keysPressed.length > 10) {
            keysPressed = keysPressed.slice(1);
        }

        if (keysPressed.toString() === konamiCode) {
            animateRaptor();
        }
    });
}

变化：

将已弃用的 jQuery bind() 替换为 on()。
允许多次使用 konami-code。
优化以仅跟踪和比较最后 10 次击键。

免责声明：我是更新后的 raptorize 2.0 插件的“作者”，该插件本身基于 ZURB (https://zurb.com/playground/jquery-raptorize) 的原始插件。

【讨论】：