使用 settimeout 和 for 循环延迟

Question

我从这里得到了这段代码： How do I add a delay in a JavaScript loop? 我在 IE 的控制台中使用它，在这段代码之后，我在控制台中使用 myFunction() 调用函数到运行;第一个代码运行s 完美，它点击第二个 "something" 标记元素 10 次，点击之间有 3000 毫秒的延迟。

function myFunction() {
    (function myLoop (i) {          
    setTimeout(function () {   
    document.getElementsByTagName("something")[1].click();                
    if (--i) myLoop(i);      //  decrement i and call myLoop again if i > 0
   }, 3000)
})(10);
}

我想用 foor 循环更改这段代码中的数字“1”，所以我想创建一个代码来点击名为 "something" 的元素。我创建了这段代码，但没有用：

for (x=1;x<10;x++){
function myFunction() {
(function myLoop (i) {          
    setTimeout(function () {   
    document.getElementsByTagName("something")[1].click();                
    if (--i) myLoop(i);      //  decrement i and call myLoop again if i > 0
   }, 3000)
})(10);
}

}

Answer 1

function myFunction() {
    (function myLoop (i) {          
        setTimeout(function () {   
        document.getElementsByTagName("div")[1].click();                
        if (--i) myLoop(i);      //  decrement i and call myLoop again if i > 0
        }, 3000)
    })(10);
  }

for (x=1;x<10;x++){
  myFunction();
}

<div>1</div>

这样试试。我用 div 而不是 something

Answer 2

如果你想每隔一段时间打印每个元素，你需要将时间值乘以一个整数，否则所有的元素将被一次记录。

此外，您可能不需要在循环内创建 myFunction

for (var x = 1; x < 5; x++) {
  (function(i) {
    setTimeout(function() {
      console.log(i);
    }, i * 1000)
  }(x))
}

Answer 3

通常使用 setInterval 而不是使用 setTimeout 的循环更容易。一切都变得简单了:

var count = 10
var intv = setInterval(function(){
  if (count === 0 ) {
    clearInterval(intv)
    console.log("done")
    return
   }
  // do something
  console.log(count--)
}, 1000)

但是你可以递归调用setTimeout:

(function myLoop (i) {          
    setTimeout(function () {   
      console.log("loop: ", i)
      if (--i) myLoop(i);      
   }, 1000)
})(10);

将整个事情放在一个 for 循环中并递归调用它虽然很奇怪，因为循环将运行并产生一堆单独的超时，这些超时将全部运行独立，我不这样做'想的就是你想要的。

使用 settimeout 和 for 循环延迟

delay with settimeout and for loop

javascript

loops

element

click

delay