Question

尝试在JS中使用setInterval（）方法，因为我正在学习JS。作为一项练习，我试图生成很多花（现在只是矩形）。我以为我可以使用setInterval（）在不同的位置连续生成矩形，如下所示：

var c = document.getElementById("primeCanvas");
var ctx = c.getContext("2d");
var xOffset = 10;

function generateFlower(x, y) {
    "use strict";
    ctx.fillStyle = "#FF0000";
    ctx.fillRect(x + xOffset, y, 150, 100);
}

function addOffset(xPos)
{
    "use strict";
    xOffset+=xPos;
}

setInterval(addOffset(50), 900);

setInterval(generateFlower(10+xOffset,10), 1000);

然而，当我运行脚本时，只有一个矩形出现在完全相同的位置（或者可能会出现更多的矩形，但相互重叠）。目的是每秒生成一个矩形，向矩形的x位置添加50（在HTML画布中）。

有人能看出为什么这不起作用吗？

Answer 1

指令setInterval(addOffset(50), 900);首先执行addOffset(50)，然后将结果安排在900ms之后执行。

我认为你想安排一份工作从900ms开始运行addOffset(50)，所以你需要这样做：

let intervalId=setInterval(function(){addOffset(50);}, 900);

对于取消计划作业，intervalId非常重要。

无法让JS setInterval正常运行

1 个答案: