按键之间没有延迟答案

【问题标题】：No delay between key press按键之间没有延迟
【发布时间】：2015-03-22 04:10:50
【问题描述】：

我正在制作游戏并且遇到问题，因为当按住左键时，角色应该向左，而当按住右键时，角色应该向右。这一切正常，但问题是当按下一个键时，角色会向相应的方向轻微移动，等待大约半秒，直到计算机意识到按键被按住，然后角色会按照我的意愿移动。按住键后如何摆脱延迟？这是我移动角色的代码。

$(document).keydown(function(key) {
    switch(parseInt(key.which, 10)) {
        case 37:
            $('#player').animate({left:'-=5px'}, 1);
            break;
        case 39:
            $('#player').animate({left:'+=5px'}, 1);
            break;
    }
});

&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;

【问题讨论】：

标签： javascript jquery delay keypress 2d-games

【解决方案1】：

如果您希望以可控的方式重复按键，则必须自己实现它，因为按键事件的触发取决于操作系统关于键应该如何重复的想法。这意味着可能有变数初始延迟和后续延迟，同时按住两个键将只让其中一个重复。

我从this 答案中获取了代码（和那句话），并将其与您的代码混合了一下，因此它适用于您的#player 元素。请查看该链接中的问题和答案。我删除了原始 cmets 以缩短此处发布的代码，但它们很有用，因此您知道自己在做什么。

代码(jsFiddle)：

function KeyboardController(keys, repeat) {

    var timers= {};

    document.onkeydown= function(event) {
        var key= (event || window.event).keyCode;
        if (!(key in keys))
            return true;
        if (!(key in timers)) {
            timers[key]= null;
            keys[key]();
            if (repeat!==0)
                timers[key]= setInterval(keys[key], repeat);
        }
        return false;
    };

    document.onkeyup= function(event) {
        var key= (event || window.event).keyCode;
        if (key in timers) {
            if (timers[key]!==null)
                clearInterval(timers[key]);
            delete timers[key];
        }
    };

    window.onblur= function() {
        for (key in timers)
            if (timers[key]!==null)
                clearInterval(timers[key]);
        timers= {};
    };

}

KeyboardController({
    37: function() { $('#player').animate({left:'-=5px'}, 100); },
    39: function() { $('#player').animate({left:'+=5px'}, 100); }
}, 100);

我还根据自己的喜好调整了您的动画设置和 KeyboardController“重复”参数（老实说有点随机）。使用这些参数，看看你最喜欢什么。

【讨论】：