1
可能重复：
Cross-browser way to get automatically repeating keydown events when key is held down如何防止keyup事件在jQuery中中断keydown事件？
我试图创建在JavaScript/CSS/HTML一个简单的游戏，而我使用jQuery（和下划线的一点点）至处理按键。玩家使用箭头键控制一个块。我遇到了同时处理多个按键的问题。我有一个系统，在这个系统中，一个闭包跟踪所有被按下的箭头键。这种运作良好，如果玩家按以下顺序按下按键：
- 玩家按下（块下移）
- 玩家按下左（块移动斜下左）
- 者释放向下（块移动左）
- 者释放左（块停止
然而，段停止，如果步骤3和4反转下面是实际在这种情况下发生的。
- 玩家按下（块下移）
- 玩家按下左（块移动斜下左）
- 者释放左（块站）
预期的行为是上一步3，该块将继续向下移动，而不是完全停止。
我从代码中看到，keyup事件实际上阻止了其他keydown事件的传播，即使我的手指仍然按住其中一个方向键时也是如此。
这是一段相关的代码。谁能告诉我问题可能出在哪里？ （使用正确的关键字）堆栈溢出
// Creates an animation handler for a specific element.
// Animation reacts to any changes as they are submitted
var getMovementAnimator = function(element) {
var params = {},
$element = $(element);
return function(changes) {
_.each(changes, function(val, key) {
// Remove null or zeroish keys from animation params
if ((val == 0 || !val) && _.has(params, key)) {
delete params[key];
} else {
params[key] = '+=' + val + 'px';
}
});
$element.animate(params, {duration: 0, queue: false});
console.log(params);
};
};
// Determines direction and speed of movement for an element
// after a keypress event
var getMovementChange = function(keyEvent, keydown) {
var isMoving = !!keydown,
params = {},
dir = '',
speed = keydown ? 5 : 0,
arrows = {left: 37, up: 38, right: 39, down: 40};
switch (keyEvent.which) {
case arrows.left:
dir = 'left';
speed = -speed;
break;
case arrows.up:
dir = 'top';
speed = -speed;
break;
case arrows.right:
dir = 'left';
break;
case arrows.down:
dir = 'top';
break;
}
// If key hit not one of above, do nothing
if (!dir) {
return false;
}
if (!speed) {
console.log('key up: ', dir);
}
params[dir] = speed;
return params;
}
// Sets up key handlers
$(document).ready(function() {
var board = $('#board'),
animatePlayer = getMovementAnimator('.player');
$(document).keydown(function(e) {
e.preventDefault();
var changes = getMovementChange(e, true);
animatePlayer(changes);
}).keyup(function(e) {
e.preventDefault();
var changes = getMovementChange(e, false);
animatePlayer(changes);
});
});