Question

我正在使用html / css / javascript制作一个乒乓球游戏，一切顺利，直到我添加第二个setTimeout（）

这是我的HTML代码

shrinkage

css无关紧要。

player.js脚本：

RightNode

ball.js脚本：

LeftNode

funcs.js脚本：

<!DOCTYPE html>
<html>
<head>
<script type='text/javascript' src="player.js"></script>
<script type='text/javascript' src="ball.js"></script>
<script type='text/javascript' src="funcs.js"></script>
<link rel="stylesheet" type="text/css" href="cetrnes.css"/>
</head>
<body>
    <img src="universe-54a.jpg" width="700px" height="525px" onclick="back()"></img>
    <img id="player" src="player1.png" onload="move()"></img>
    <img id="ball" src="ball.png"></img>
</body>
</html>

player.js中的move函数使玩家上下移动，后退函数使其改变方向。当我只打电话时，它工作正常。 ball.js中的移动功能使球移动。当我只打电话时，它工作正常。但是当我打电话给他们时，玩家都会疯狂地上下快速上升和下降，而球只是飞出屏幕。我的编码可能看起来有些奇怪，但在写作时我遇到了一些其他问题，这种写作方式也有效。

感谢您的帮助，谢谢。

Answer 1

如果您在控制台中暂停脚本执行并将鼠标悬停在this.move或Ball函数中使用的Player上，您会看到this.move指的是：

function move() {
    player.move();
    ball.move();
}

这意味着，每次this.move或Player内部调用Ball时，player.move()和ball.move()会再次调用$('body').on('click', '.matchBtns', function(){ ... var value = this.innerHTML; for (var i = 0,l = data.states.length; i< l; i++){ if (data.states[i].state_name === value && data.states[i].answer === 'correct'){ /// is correct break; // to stop the loop }else { // not correct, continue } } ... }

使用两个setTimeout函数后图像变得疯狂

1 个答案: