可以't使JS setInterval正常工作

Can't get JS setInterval to function properly

本文关键字:常工作 工作 setInterval JS 可以      更新时间:2023-09-26

当我正在学习JS时,我正试图在JS中使用setInterval((方法。作为一个练习,我正在尝试生成很多花(现在只是矩形(。我想我可以使用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画布中(。

有人能理解为什么这不起作用吗?

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

我认为你想安排一个作业在900毫秒后运行addOffset(50),所以你需要这样做:

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

intervalId对您取消计划作业很重要。