6

さて、キーボードのキーを押したままにすると、最初の発射後、1秒の遅延があります。
先に進んでメモ帳を開き、最初の発砲後に表示されるキー（例：「x」）を押し続けると、遅延が発生します。

ただし、JavaScriptを使用してHTML5 Canvasでゲームを開発しようとしていますが、その1秒の遅延は非常に煩わしいものです。さらに、プレーヤーの歩行アニメーションが停止します。

では、JavaScriptでその厄介な遅延を削除するにはどうすればよいですか（jQueryはありません！）？

私のキーダウンイベントはこのパターンで機能します-

document.onkeydown = getKey;
function getKey(e) {
    switch(e.keyCode) {
        case 38: // UP
            Player.PositionY--;
        break;
        case 39: // RIGHT
            Player.PositionX++;
        break;
        case 40: // DOWN
            Player.PositionY++;
        break;
        case 37: // LEFT
            Player.PositionX--;
        break;
    }
}
4

3 に答える 3

5

でイベントを開始し、keydownで停止することができますkeyup

$('#mycanvas').on('keydown', function() { 
   $(document).trigger('start'); 
}); 

$('#mycanvas').on('keyup', function() { 
   $(document).trigger('stop'); 
});

$(document).on('start', startAnimation);
$(document).on('stop', stopAnimation);

function startAnimation(e) { //start something }
function stopAnimation(e) { //stop something }
于 2013-01-21T23:24:59.760 に答える
1

代わりに、キーが最初に押されたときにリッスンし、次にキーが離されたときにリッスンします。これは、移動速度の現在の状態をどこかに記録して、それらのイベントの間に適用できるようにする必要があることも意味します。

この例は、前進するためのサーバーにすぎません。他の方向に簡単に拡張できるはずです。

var playerSpeed = 0;

document.onkeydown = keyDown;
document.onkeyup = keyUp;

function keyDown(e) {
    switch(e.keyCode) {
        case 38: // UP
            playerSpeed = 1; // moving!
            break;
        // other cases...
    }
}

function keyUp(e) {
    switch(e.keyCode) {
        case 38: // UP
            playerSpeed = 0; // NOT moving!
            break;
        // other cases...
    }
}

// Whatever loop is called for each frame or game tick
function updateLoop() {
  // rendering, updating, whatever, per frame
  Player.PositionY += playerSpeed;
}

このように、キーボードのリピートレートは関係ありません。すべてonkeydown、常に最終的にはonkeyup。あなたがしなければならないすべては、それらのイベントの間で異なる方法で物事を更新します。

于 2013-01-21T23:41:51.430 に答える
1

あなたは幸運です、私はこれをゲーム用にコーディングするだけです。

Controller = {
    keyIsDown: [],

    // Add a new control. up is optional.
    // It avoids key repetitions
    add: function (key, down, up) {
        $(document).keydown(function(e) {
            if(e.keyCode === key && !Controller.keyIsDown[key]) {
                    down()
                Controller.keyIsDown[key] = true
                return false
            }
        })

        $(document).keyup(function(e) {
            if(e.keyCode === key) {
                if(up) up()
                Controller.keyIsDown[key] = false
                return false
            }
        })
    },
}

例：

Controller.add(65,
    function () {
        console.log("A is down")
    },
    // This argument is optional
    function () {
        console.log("A is up")
})
于 2013-01-22T01:16:04.370 に答える