Question

我知道它可能但我似乎无法弄明白。在它的基本形式中，我有一个每个按键事件移动5个像素的画布圆圈但是这在拍摄时看起来相当缓慢并且非常有弹性，而且当更改按键或从快速按键切换到按住时它会停止。

那么有人可以告诉我一种没有它口吃的方法吗？

感谢。

Answer 1

您要做的是将keydown和keyup上的变量设置为true或false，以检查每个tick。像这样：

var tickRate = 30,
    keyDown = {},
    keyMap = {
      'left':  37,
      'up':    38,
      'right': 39,
      'down':  40
    };

$('body').keydown(function(e){ keyDown[keyMap[e.which]] = true;  });
$('body').keyup(function(e){   keyDown[keyMap[e.which]] = false; });

var tick = function() {
  if        (keyDown['up']) {
    // up code
  } else if (keyDown['down']) {
    // down code
  } else if (keyDown['left']) {
    // left code
  } else if (keyDown['right']) {
    // right code
  }

  // other code

  setTimeout(tick, tickRate);
};

tick();

Answer 2

您遇到的主要问题是您受操作系统“密钥重复”功能的支配。通常，如果您按住某个键，则会生成一次keyPress事件，然后（在延迟之后）重复该事件。但是如果你想控制这个延迟/重复，那就不够好了。

相反，我有自己的轮询功能，设置为每隔几毫秒运行一次，检查您感兴趣的每个密钥是关闭还是关闭。然后你知道，对于每次轮询，当按键关闭时，无论操作系统的设置如何，都可以触发某些事件。

然后，您可以应用自己的算法和乘数来平滑移动。

在Javascript中平滑按键事件处理？

2 个答案: