javascript - svg 创建元素所有 3 秒，直到 i 是 x

Question

我试图弄清楚如何在 3 秒内创建一个 svg 元素，直到 i == x.length。

我尝试了很多方法，但我找不到答案。目前，这是我的代码：

for (var i = 0; i < whichBloons.length; i++) {

  setTimeout(function(i) {
    bloons[i].create(bloonCounter[i]);
  }, 10000, i);

} }

我知道我做错了什么，但我现在尝试并用谷歌搜索了几个小时，但仍然没有任何线索。

有人可以帮助我吗？

标签： javascripthtmlsvg

Answer 1

该setTimeout方法将提供的函数延迟指定的时间量（以毫秒为单位）。而不是将其设置为 10000 毫秒的恒定持续时间，您可能想要根据您的计数器进行设置i。每 3 秒将类似于(i+1) * 3000

像这样：

for (var i = 0; i < whichBloons.length; i++) {
  setTimeout(function(i) {
    bloons[i].create(bloonCounter[i]);
  }, (i+1) * 3000, i);
}