对角移动不起作用并且在left-longPress / right同时发出
但是在双键按下时,这艘船发疯了！
$(document).bind('keydown',function(e) {
var Box = $("#plane"),left = 37,up = 38,right = 39,down = 40
if (e.keyCode == left) {
Box.animate({left: "-=5000"},3000);
}
if (e.keyCode == up) {
Box.animate({top: "-=5000"},3000);
}
if (e.keyCode == right) {
Box.animate({left:"+=5000"},3000);
}
if (e.keyCode == down) {
Box.animate({top: "+=5000"},3000);
}
});
$(document).bind('keyup',function() {
$('#plane').stop();
});
解决方法
我搞砸了类似的事情,这是我遇到的解决方案.
setInterval(movePlane,20);
var keys = {}
$(document).keydown(function(e) {
keys[e.keyCode] = true;
});
$(document).keyup(function(e) {
delete keys[e.keyCode];
});
function movePlane() {
for (var direction in keys) {
if (!keys.hasOwnProperty(direction)) continue;
if (direction == 37) {
$("#plane").animate({left: "-=5"},0);
}
if (direction == 38) {
$("#plane").animate({top: "-=5"},0);
}
if (direction == 39) {
$("#plane").animate({left: "+=5"},0);
}
if (direction == 40) {
$("#plane").animate({top: "+=5"},0);
}
}
}
延迟的问题似乎是大多数浏览器将采用第一个输入(在keyDown上),然后在反复运行函数之前它们有半秒的延迟.如果我们不记得keydown上的函数,而是有一个间隔检查一个关联数组,我们存储哪些键被按下,这似乎可以平滑移动.它还允许一次按下多个键,这意味着对角线移动.然后我们将使用keyup事件删除相应的键.
>间隔的更新频率. (上面演示中的20ms)
>平面每次移动的像素数. (上面的演示中有5个)
我发现间隔频率上的20毫秒可以让你运动相当平稳.
我意识到这是一个非常古老的线索,但我认为无论如何我都会做出贡献.
