'Looping' JavaScript functions

Question

I have the below script.

function slideShow1(){
    document.getElementById('dynimg').src="Other/noctis.jpg";
    var timer1 = setTimeout(slideShow2(),5000);
}

function slideShow2(){
    document.getElementById('dynimg').src="Other/retriever.jpg";
    var timer2 = setTimeout(slideShow3(),5000);
}

function slideShow3(){
    document.getElementById('dynimg').src="Other/miningop2.jpg";
    var timer3 = setTimeout(slideShow1(),5000);
}

It's crude, I know... And it's also not working. The idea is for each function to trigger the next after a given period and therefore creating a slideshow where and img is changed repeatedly. I am trying to use body onload="slideShow1()"

canon · Accepted Answer · 2013-07-16 18:23:35Z

6

Those parentheses are causing your function to be executed immediately.

setTimeout(slideShow2(), 5000);

As such, you think you're passing your function to setTimeout but you're actually executing your function and passing its return value (undefined in this case).

So, your function gets called immediately and setTimout has nothing to execute five seconds later.

Just remove the parentheses:

function slideShow1(){
    document.getElementById('dynimg').src = "Other/noctis.jpg";
    setTimeout(slideShow2, 5000);
}

function slideShow2(){
    document.getElementById('dynimg').src = "Other/retriever.jpg";
    setTimeout(slideShow3, 5000);
}

function slideShow3(){
    document.getElementById('dynimg').src = "Other/miningop2.jpg";
    setTimeout(slideShow1, 5000);
}

edited Jul 16, 2013 at 18:23

answered Jul 10, 2013 at 19:11

canon

41.9k10 gold badges77 silver badges102 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

jahroy Over a year ago

Another way to say it: you're passing "the result of executing the function" rather than passing "a reference to a function that will get executed later".

mgarciaisaia Over a year ago

So the object returned by the function will be the one that would get called the call() method on.

Rudi Kershaw Over a year ago

Does this mean that I can't parse a function with an argument into setTimeout?

Rudi Kershaw Over a year ago

@canon - Sorry, I probably wasn't clear. Lets say I want my setImgSrc(newSrc){} function to be called by a setTimeout function.. does that mean I can't because setImgSrc requires an arguement?

Ian Over a year ago

@canon Please don't suggest that. It's non-standard and doesn't work in IE. You even provided the link to the MDN docs that say this...

Collectives™ on Stack Overflow

'Looping' JavaScript functions

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related