0

我正在尝试开发在幻灯片之间暂停的幻灯片。所以我正在尝试使用 setTimeout 语句，如下所示。这是为了将 2.jpg 替换为 1.jpg，在单击按钮时暂停 10 秒。但它现在确实有效。谁能帮我。谢谢。

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

3 回答 3

6

这里有几件事是错误的。首先，不建议在setTimeout的第一个参数中对其进行 eval 的传递代码。最好传递一个回调：

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

其次，您在超时内调用不带参数的 swap() 方法。它应该传入一个新的图像文件名（可能通过声明一个文件名数组），或者检查是否设置了参数。

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

这个函数在第一次运行后显然不会做任何事情（因为没有提供新的图像文件名）。使用数组，您可以遍历多个文件名：

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

这将继续在数组中的图像之间切换，直到取消超时。

于 2008-12-17T00:58:45.497 回答
2

您的交换函数需要一个参数，因此它不适用于 setTimeout。

于 2008-12-17T00:48:46.000 回答
-1

不需要 Javascript 来制作幻灯片。您所要做的就是将每个图像放入一个单独的页面，然后将这一行添加到 <head> 部分中每个页面的顶部：

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

“10”是进入下一页之前等待的秒数，“NextPage.html”是指向包含下一个要显示的图像的页面的链接。

于 2008-12-17T05:14:14.717 回答