Use of setTimeout - how to pass parameters?

Question

I am trying to develop a slideshow with a pause between slides. So I'm trying to use the setTimeout statement as shown below. This is written to swap 2.jpg for 1.jpg with a pause of 10 seconds on clicking the button. But it does now work. Can anyone help me. Thanks.

<html>
<head>
<script type="text/javascript">
var t;
function swap(newImage) {
  var fileName=newImage.toString()+".jpg"
  document.slideshow.src=fileName
  t=setTimeout("swap()",10000)
}
</script>
</head>  
<body> 
  <img name="slideshow" src="1.jpg" width="450" height="335" />
  <br /><br />
  <input type="button" onClick="swap('2')" value="Change image" /> 
  <br /><br />
</body>
</html>

So what happens? Show more code. I hope your code doesn't actually look like what you posted here. — Strelok
– Strelok, Commented Dec 17, 2008 at 0:45
that really doesn't make sense, because the setTimeout action doesn't define an argument, so how could it effectively do anything? — Dave
– Dave, Commented Dec 17, 2008 at 0:49
Answered in better detail at How can I pass a parameter to a setTimeout() callback? — Dan Dascalescu
– Dan Dascalescu, Commented Apr 17, 2015 at 7:25

Eran Galperin · Accepted Answer · 2008-12-17 01:25:26Z

6

There are a couple of things wrong here. First, its passing code to be eval'ed in the first parameter of setTimeout is not recommended. Better pass a callback instead:

 setTimeout(function() { swap(); },10000);
 //Or
 setTimeout(swap,10000); //Passing the actual function as the callback

Second, you are calling the swap() method without parameters inside the timeout. It should pass in a new image filename (perhaps by declaring an array of filenames), or check whether the parameter is set or not.

function swap(newImage,element) { 
   if(newImage) {
       var fileName = newImage.toString()+".jpg"; 
       element.src = fileName;
   }
   t=setTimeout(this,10000) 
}

This function obviously won't do anything after the first run (since no new image filenames are supplied). Using an array you could iterate over several filenames:

var images = ['1.jpg','2.jpg','3.jpg'];
var slideshow = function(element, images, index) {
   if(!index || ( (index + 1) > images.length) ) index = 0;
   element.src = images[index];
   t = setTimeout(function(){
       slideshow(element, images, index + 1);
   },10000) 
};

//Fetch the image element the slideshow is running on
var element = document.slideshow; 
slideshow(element, images);

This will continue switching between the images in the array until the timeout is canceled.

edited Dec 17, 2008 at 1:25

answered Dec 17, 2008 at 0:58

Eran Galperin

86.9k25 gold badges119 silver badges132 bronze badges

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

1 Comment

nickf Over a year ago

setTimeout can accept a string as the first parameter. that string gets eval()'d so his method would work, if not for forgetting to pass the parameter.

OJ. · Accepted Answer · 2008-12-17 00:48:46Z

2

Your swap function requires a parameter, so it won't work with setTimeout.

answered Dec 17, 2008 at 0:48

OJ.

29.6k6 gold badges59 silver badges71 bronze badges

Comments

Mark Ransom · Accepted Answer · 2008-12-17 05:14:14Z

-1

Javascript isn't necessary to do a slideshow. All you have to do is put each image into a separate page, then add this single line to the top of each page in the <head> section:

<meta http-equiv="refresh" content="10;url=NextPage.html"/>

"10" is the number of seconds to wait before going to the next page, and "NextPage.html" is the link to the page containing the next image to display.

answered Dec 17, 2008 at 5:14

Mark Ransom

310k44 gold badges423 silver badges660 bronze badges

1 Comment

Mark Ransom Over a year ago

@DanDascalescu I don't see why that's worth a downvote. I try to save those for answers that just plain don't work.

Collectives™ on Stack Overflow

Use of setTimeout - how to pass parameters?

3 Answers 3

1 Comment

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related