让我解释一下我的情况......我正在制作一个2D平台游戏,你可以在那里四处搜寻东西。四处走动使用W,A& D键和用鼠标完成拍摄。当我单独执行所有操作时,一切正常,但是当我单击鼠标按钮并同时按下某个键时,我的代码开始表现得好像仍然按下了键。这种情况有时只会发生。
我注册了所有键盘事件:
<body onload="init()" onkeydown="press(event);" onkeyup="release(event);">
以下是处理该问题的脚本:
var KEY = {W: 87, A: 65, S:83, D: 68, E: 69};
var input = {
right: false,
up: false,
left: false,
down: false,
e: false
};
function press(evt) {
var code = evt.keyCode;
switch(code)
{
case KEY.W: input.up = true; break;
case KEY.A: input.left = true; break;
case KEY.S: input.down = true; break;
case KEY.D: input.right = true; break;
case KEY.E: input.e = true; break;
}
}
function release(evt)
{
var code = evt.keyCode;
input.code = code;
switch(code)
{
case KEY.W: input.up = false; break;
case KEY.A: input.left = false; break;
case KEY.S: input.down = false; break;
case KEY.D: input.right = false; break;
case KEY.E: input.e = false; break;
}
}
即使我没有注册鼠标事件,也会发生这种情况。有人可以解释原因吗?我该如何解决这个问题?
答案 0 :(得分:1)
<强> EDITED 强>
似乎偶尔也不会出现生涩行为。如果您按住并保持left
,然后按up
并释放left
,则移动将继续。但是,如果您在一段时间后释放up
,则移动将停止。 IE浏览器。你可以进行连续的圆周运动,但你无法回到原来的方向。这可能是事件处理过程,使用堆栈类型保存事件调用及其返回点。
下面是一个示例代码,它可以解决问题。它使用箭头键移动点。为清晰起见,代码位于全局空间,仅适用于IE,但您只需按照自己的意愿编辑它。
<html>
<head>
<script>
function move(elem){
if(i[37])elem.style.left=elem.style.pixelLeft-2;
if(i[38])elem.style.top=elem.style.pixelTop-2;
if(i[39])elem.style.left=elem.style.pixelLeft+2;
if(i[40])elem.style.top=elem.style.pixelTop+2;
return;
}
function keyDn(){
var key=window.event.keyCode;
if(i[key]!==undefined) i[key]=true;
return;
}
function keyUp(){
var key=window.event.keyCode;
if(i[key]!==undefined) i[key]=false;
return;
}
window.onload=function (){
spot=document.getElementById('movablespot');
i={'37':false,'38':false,'39':false,'40':false};
document.body.onkeydown=keyDn;
document.body.onkeyup=keyUp;
a=setInterval(function (){move(spot);return;},5);
}
</script>
</head>
<body>
<span id="movablespot" style="position:absolute;top:100px;left:100px;">O</span>
</body>
</html>