Question

我用javascript和HTML5画布创建一个简单的乒乓球游戏。当用户或计算机得分时，我想在屏幕上显示一些文字3秒钟说：＆＃34;播放器1/2得到了点！＆＃34;在＆＃39; reset（）＆＃39;之前函数被调用。在我显示文本之前，我将脚本添加1分到分数。每当我调用setTimeout（）函数时，它都会等待，但在等待时间内它会重复添加分数函数，直到等待结束。以下是我的代码片段：

window.onload = function() {
c = document.getElementById("gc");
ctx = c.getContext('2d');
setInterval(update, 1000/30);
c.addEventListener('mousemove', function(e) {
    p1y=e.clientY-ph/2;
});
}

function update() {
bx+=xv;
by+=yv;
if(by<2 && yv<0) {
    yv=-yv;
}
if(by>c.height-bd && yv>0) {
    yv=-yv;
}

if(by>p1y && by<p1y+ph) {
        xv=-xv;
        dy=by-(p1y+ph/2);
        yv=dy*0.3;
    } else {
        // Add score to player 2
        score2++;

        // Draw text on screen
        ctx.fillStyle='red';
        ctx.fillText("Player 2 gets the point.", 25, 25);

        // Wait 3 seconds, then reset.
        setTimeout(function() {
            reset();
        }, 3000);

        // However while it's waiting, it repeats score2++; over and over.
    }
}
if(bx>c.width-bd-pt-1) {
    if(by>p2y && by<p2y+ph) {
        xv=-xv;
        dy=by-(p2y+ph/2);
        yv=dy*0.3;
    } else {
        score++;
        ctx.fillStyle='green';
        ctx.fillText("Player 1 gets the point.", 25, 25);
        reset();
    }
}

if(p2y+ph/2>by) {
    p2y-=ais;
} else {
    p2y+=ais;
}

drawBackground();
drawPaddles();
drawBall();
drawScore();
drawMLine();
}

我真的很茫然。谢谢！

Javascript setTimeout（）函数重复以前的函数

0 个答案: