Question

我试图在javascript中旋转一组6个图像，而不是jquery。第一张图片显示，但其余图片不会旋转。这是我的代码：

<html>
<head>
<script type="text/javascript">
function rotatePic() {

var qutAd = document.getElementById("yumOreos");
var imgs = ["images/img1.png", "images/img2.png", "images/img3.png", "images/img4.png", "images/img5.png", "images/img6.png"];
var ad = 0;

qutAd.src = imgs[ad];

setInterval(function () {ad++;if (ad == imgs.length) {ad = 0;}}, 4000);
}  

</script>
</head>
<body onload="rotatePic()">
     <img id="yumOreos">
</body>
</html>

我做错了什么？感谢。

Answer 1

您还必须在区间函数中设置src。

setInterval(function () {
    ad++;
    if (ad == imgs.length) ad = 0;
    qutAd.src = imgs[ad];
}, 4000);

Answer 2

您忘记更改数组的索引，以更改源。所以你可以这样做

setInterval(function () {if (ad == imgs.length) {ad = 0;} qutAd.src =imgs[ad++]}, 4000);
}

Javascript更改计时器上的图像

2 个答案: