javascript setInterval 函数对我不起作用

Question

我尝试创建幻灯片，我需要通过新参数重试我的函数，但是当我尝试使用 setInterval() 函数时，它只运行一次。为什么真的？

var sIndex = 0;
var slide = document.getElementsByClassName('slide');

function slider(n) {
  if (sIndex + n >= 0 && sIndex + n <= slide.length - 1) {
    slide[sIndex].style.display = "none";
    sIndex += n;
    slide[sIndex].style.display = "block";
  } else if (sIndex + n < 0) {
    slide[sIndex].style.display = "none";
    sIndex = slide.length - 1;
    slide[sIndex].style.display = "block";

  } else if (sIndex + n > slide.length - 1) {
    slide[sIndex].style.display = "none";
    sIndex = 0;
    slide[sIndex].style.display = "block";
  }
}
setInterval(function() {
  slider(sIndex);
}, 2000);

Answer 1

sIndex 始终保持为 0 查看您的代码。

var sIndex = 0;
var slide = document.getElementsByClassName('slide');

function slider(n) {
  // first run: n=0 plus sIndex=0, leads to sIndex stays 0 every loop
  if (sIndex + n >= 0 && sIndex + n <= slide.length - 1) {
    slide[sIndex].style.display = "none";
    sIndex += n;
    slide[sIndex].style.display = "block";
  } else if (sIndex + n < 0) {
    slide[sIndex].style.display = "none";
    sIndex = slide.length - 1;
    slide[sIndex].style.display = "block";

  } else if (sIndex + n > slide.length - 1) {
    slide[sIndex].style.display = "none";
    sIndex = 0;
    slide[sIndex].style.display = "block";
  }
  console.log(new Date(), sIndex)
}
setInterval(function() {
  slider(sIndex);
}, 2000);

<div class="slide"></div>

编辑:我的回答给出了原因，但没有解决方案。 @Satpal 的代码给出了一个:删除 n 并添加 1。