HTML5箭头键无法正常工作

时间:2013-11-12 07:56:08

标签: javascript html5

大家好,

当按下[space]键时,我正在解决使箭头键正常工作的问题。一切都在工作,拿着[空格]键和一个箭头键。但是如果我尝试按[空格]并同时按住[向上]和[向左],它将直到屏幕顶部,好像[左]键没有被按下(它应该对角线移动)到左上角)。这只是在按[空格]时发生的。 我想用这把钥匙以后拍子弹。

我的代码中有什么问题吗?还是某种bug?

为我糟糕的英语道歉:/ ..

<!DOCTYPE html>
<body>
        <canvas id="myCanvas" width="568" height="262">
        </canvas>

<script type="text/javascript">
var canvas;
var ctx;
var dx = 0.5;
var dy = 0.5;
var x = 284;
var y = 130;
var WIDTH = 568;
var HEIGHT = 262;
var keys = new Array();

function circle(x,y,r) {
  ctx.beginPath();
  ctx.arc(x, y, r, 0, Math.PI*2, true);
  ctx.fill();
}

function rect(x,y,w,h) {
    ctx.beginPath();
    ctx.rect(x,y,w,h);
    ctx.closePath();
    ctx.fill();
    ctx.stroke();
}

function clear() {
  ctx.clearRect(0, 0, WIDTH, HEIGHT);
}

function init() {
    canvas = document.getElementById("myCanvas");
    ctx = canvas.getContext("2d");
    window.addEventListener('keydown',doKeyDown,true);
    window.addEventListener('keyup',doKeyUp,true);
    return setInterval(draw, 1);
}

function draw() {
    move();
    clear();
    ctx.fillStyle = "white";
    ctx.strokeStyle = "black";
    rect(0,0,WIDTH,HEIGHT);

    // player ///
    ctx.fillStyle = "purple";
    circle(x, y, 20);

}

function doKeyDown(evt)
{
    keys[evt.keyCode] = true;
    evt.preventDefault();   // Prevents the page to scroll up/down while pressing arrow keys
}

function doKeyUp(evt){
    keys[evt.keyCode] = false;
}

function move() {
        if (32 in keys && keys[32]){
            ; // fire bullets
        }
        if (38 in keys && keys[38]){ //up
            y -= dy;
        }
        if (40 in keys && keys[40]){ //down
            y += dy;
        }
        if (37 in keys && keys[37]){ //left
                x -= dx;
        }
        if (39 in keys && keys[39]){ //right
                x += dx;
        }
}

init();
</script>

</body>
</html>

2 个答案:

答案 0 :(得分:4)

这可能与您的代码无关。为节省成本,许多键盘不能同时支持3个或更多键的每个组合,并且专门用于支持常用的组合(例如Ctrl + Alt + Del)。这种现象被称为“重影”。

有关详细说明,请参阅this page from Microsoft

答案 1 :(得分:1)

我有同样的问题(我发现了问题,但没有找到解决方案),向上和向左的关键代码互相跟随。向下和向右做。关键代码彼此跟随的事实似乎是个问题。如果您将A设置为向上移动播放器而将B设置为向下移动播放器,则按A + B +空格键会出现同样的问题。但是当键码不同时(例如,已经),三键按下工作。使用WASD似乎是一个好主意,但要等到使用法语键盘的人玩你的游戏。 我写这篇文章的任何方式都希望有人找到一个解决方法。