space按下时的事件，只有一次

Question

我有一些问题：我有这个：（在函数中..）

var space = 0;

setInterval(space, 20);
var keys = {}

$(document).keydown(function(e) {
    keys[e.keyCode] = true;
});

$(document).keyup(function(e) {
    delete keys[e.keyCode];
});

function space() {
    for (var direction in keys) {
        if (!keys.hasOwnProperty(direction)) continue;
        if (direction == 32) {
                space++;
                console.log(space);
            }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

32 == Space 键，但是我在控制台看到 space 被按下了 3 次（space == 3），keyup keypress 和 keydown（我认为），当按下 space 时，我怎么可能只有 "space = 1"？

Answer 1

似乎正在发生的事情是，由于它每 20 毫秒运行，当您按住 space 条时，space 函数会不断增加计数。我添加了一个标志以防止再次执行，直到释放密钥并且它工作正常。真的，你应该只使用按键事件并检查那里是否 keyCode === 32 来跟踪你的计数。将触发更少的事件。如果你想看看发生了什么，你可以注释掉标志并检查控制台。

var spaceCount = 0;
var running = false;
var keys = {}

$(document).keydown(function(e) {
  console.log("keycode", e.keyCode);
  keys[e.keyCode] = true;
});

$(document).keyup(function(e) {
  console.log("keyup")
  delete keys[e.keyCode];
  running = false;
});

function space() {
  if(running) return;
  for (var direction in keys) {
    running = true;
    console.log(direction);
    if (!keys.hasOwnProperty(direction)) continue;
    if (direction == 32) {
      spaceCount++;
      console.log("count: " + spaceCount);
      console.log(keys);
    }
  }
}

setInterval(space, 20);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 2

希望对您有所帮助：

var space = 0; 
    var keys = {};
    var keys2 = {};

$(document).keydown(function(e) {
    keys[e.keyCode] = true;
});

$(document).keyup(function(e) {
    keys[e.keyCode] = false;
});

setInterval(function(){spacing()}, 20); 

function spacing() {

    if (keys[32] && !keys2[32])
        {
            space++;
            keys2[32] = true;
        }
        else if(!keys[32])
        {
            keys2[32] = false;
        }

console.log(space);
 }

space按下时的事件，只有一次

Event when space is pressing, only one time

javascript

jquery

keycode