例如，如何每5秒更改一次图像？

Altin 发表于 Dev

Altin：

我的HTML代码中有3张图片，我希望它们每5秒更改一次。为什么我的代码不起作用？

var images = [];

images[0] = ['photoFromInternet'];
images[1] = ['photoFromInternet2'];
images[2] = ['photoFromInternet3'];
var index = 0;

function change() {
  document.mainPhoto.src = images[index];
  if (index == 2) {
    index = 0;
  } else {
    index++;
  }

  setInterval(change(), 1000);
}

window.onload = change();

<div class="lastMain">
  <a href="www.comingsoon.com" id="slider">
    <img id="mainPhoto">
    <div class="mainSlider">
      <img src="photoFromInternet1" style="display: none">
      <img src="photoFromInternet2*" style="display: none">
      <img src="photoFromInternet3" style="display: none">
    </div>
  </a>
</div>

PS：如果可以帮助，请不要使用jquery，因为我还没有学到。

丰戈：

您应该在func外部运行'change'函数，并将函数名称传递给setInterval函数，如下所示

let images = ['photoFromInternet', 'photoFromInternet2', 'photoFromInternet3'];

let index = 0;
const imgElement = document.querySelector('#mainPhoto');

function change() {
   imgElement.src = images[index];
   index > 1 ? index = 0 : index++;
}

window.onload = function () {
    setInterval(change, 5000);
};

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。