如您所见,我这里有这段代码:
<!DOCTYPE html>
<html>
<body>
<canvas id="myCanvas" width="500" height="300"
style="border:1px solid #d3d3d3;">
Your browser does not support the canvas element.
</canvas>
<script>
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
var player = {
x: 0,
y: 297.3
};
var monster = {
x: 150,
y: 296
};
var slope = {
1: {
x: 183,
y: 299
}
}
ctx.font = "13px monospace";
setInterval(function() {
player.x += 8;
ctx.clearRect(0, 0, canvas.width, canvas.height);
}, 50);
setInterval(function() {
ctx.fillText("\\o/",player.x, player.y)
ctx.fillText(">:)",monster.x, monster.y)
ctx.fillText("/",slope[1].x, slope[1].y)
ctx.fillText("_______________________",0,296);
ctx.fillText("_______________________",189,286);
if (player.x >= monster.x - 25) {
monster.x = 1000; monster.y = 1000;
}
if (player.x >= slope[1].x - 21) {
player.y -= 10;
}
}, 50);
</script>
</body>
</html>
我想阻止玩家在接触斜坡后上升超过 10(y -= 10 然后停止),而不是继续上升。有什么解决办法吗?
最佳答案
您可以使用在初始操作中设置为 false 的状态变量,并在操作后设置为 true:
<!DOCTYPE html>
<html>
<body>
<canvas id="myCanvas" width="500" height="300"
style="border:1px solid #d3d3d3;">
Your browser does not support the canvas element.
</canvas>
<script>
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
var player = {
x: 0,
y: 297.3
};
var monster = {
x: 150,
y: 296
};
var slope = {
1: {
x: 183,
y: 299
}
}
ctx.font = "13px monospace";
setInterval(function() {
player.x += 8;
ctx.clearRect(0, 0, canvas.width, canvas.height);
}, 50);
var up = false;
setInterval(function() {
ctx.fillText("\\o/",player.x, player.y)
ctx.fillText(">:)",monster.x, monster.y)
ctx.fillText("/",slope[1].x, slope[1].y)
ctx.fillText("_______________________",0,296);
ctx.fillText("_______________________",189,286);
if (player.x >= monster.x - 25) {
monster.x = 1000; monster.y = 1000;
}
if (!up && player.x >= slope[1].x - 21) {
player.y -= 10;
up=true
}
}, 50);
</script>
</body>
</html>
关于javascript - 一旦达到条件就停止,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44457830/