本网站上的第一个问题,所以我希望我做对了!我有一个javascript函数,我想在页面加载时显示图像(image1.jpg),然后每2秒通过循环更改图像.但是只显示第一个图像所以似乎没有调用JS函数.任何人都可以告诉我,如果我在这里做错了,因为它对我来说很好,所以无法理解为什么它不起作用.谢谢
<html>
<head>
<script type="text/javascript">
function displayImages(){
var images = ['image1.jpg', 'image2.jpg', 'image3.jpg'];
var i = 1;
if(i>images.length-1){
this.src=images[0];
i=1;
}else{
this.src=images[i];
i++;
}
setTimeout("displayImages()", 2000);
}
</script>
</head>
<body onload="displayImages();">
<img id="myButton" src="image1.jpg" />
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
你需要移动线
var i = 1;
Run Code Online (Sandbox Code Playgroud)
在 displayImages -function 之外,它每次都会从一个开始!
编辑:但使用全局变量不被视为良好的做法,所以你可以使用闭包.另外如其他答案中所述,您正在引用this哪些不参考图像对象,所以我更正了这一点,并简化了逻辑:
<script type="text/javascript">
function displayImages( i ){
var images = ['image1.jpg', 'image2.jpg', 'image3.jpg'];
var img = document.getElementById('myButton');
img.src = images[i];
i = (i+1) % images.length;
setTimeout( function() { displayImages(i); }, 2000 );
}
</script>
<body onload="displayImages(0);">
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
101 次 |
| 最近记录: |