delay with settimeout and for loop

Question

I have this code from here: How do I add a delay in a JavaScript loop? I use it in console in IE, and after this code I call the function with myFunction() in console to run; This first code runs perfectly, it clicks on the second "something" tagnamed element 10 times and between the clicks are 3000 ms delay.

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);
}

I would like to change the number "1" in this code with foor loop, so I want create a code which clicks on elements named "something". I created this code, but is not working:

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);
}

}

score 0 · Accepted Answer · answered Nov 21 '18 at 08:27

If you want to print each element at an interval you need to multiply the timing value with an integer, otherwise all of them will be logged at one time.

Also you may not need to create myFunction inside the loop

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

score 0 · Answer 2 · answered Nov 21 '18 at 08:29

It usually easier to use setInterval rather the a loop with setTimeout. Everything is just simpler:

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

But you can recursively call setTimeout:

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

Putting the whole thing in a for loop AND calling it recursively is strange though, because the loop will run and make a bunch of individual timeouts that will all run independently, which I don't think is what you want.

score -1 · Answer 3 · answered Nov 21 '18 at 08:25

-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>

Try like this. I used div instead of something

answered Nov 21 '18 at 08:25

Dananjaya Ariyasena

606
3
15

This code also clicks on the second div element, I want loop through the div elements-> (div)[x] – Nov 21 '18 at 08:32
I tried your code with some changes: i pass the argument x in the foor loop to the myFunction, so the function definition will be function myFunction(x){} and inside the for loop is myFunction(x); but this also doesnt work, because now clicks on the last element in the foor loop only, for example if i define the for loop as for(x=1;x<5;x++) then only the 4. elemnt will be clicked. – Nov 21 '18 at 08:35
brk has right, it is needed to multiply the timing value with an integer. – Nov 21 '18 at 08:57

delay with settimeout and for loop

3 Answers3

Linked