如何在自定义滑块JavaScript代码中插入自动播放选项

我已经创建了一个滑块代码，但问题是我必须使其自动播放。这段代码实际上与我的自定义滑块兼容，我只想让它自动播放。我尝试了如下所示的一些代码：

var slideIndex = 1;
showSlides(slideIndex);

function plusSlides(n) {
    showSlides(slideIndex += n);
}

function currentSlide(n) {
    showSlides(slideIndex = n);
}

function showSlides(n) {
    var i;
    var slides = document.getElementsByClassName("contents-2");
    var slides2 = document.getElementsByClassName("contents-1");
    var dots = document.getElementsByClassName("dot");
    if (n > slides.length) {
        slideIndex = 1
    }
    if (n < 1) {
        slideIndex = slides.length
    }
    for (i = 0; i < slides.length; i++) {
        slides[i].className = slides[i].className.replace(" cont-1", "");
    }
    for (i = 0; i < slides2.length; i++) {
        slides2[i].className = slides2[i].className.replace(" cont-2", "");
    }
    for (i = 0; i < dots.length; i++) {
        dots[i].className = dots[i].className.replace(" active-page", "");
    }
    dots[slideIndex - 1].className += " active-page";
    slides[slideIndex - 1].className += " cont-1";
    slides2[slideIndex - 1].className += " cont-2";
    setTimeout(currentSlide, 2000);
}

var slideIndex=1；
放映幻灯片（幻灯片索引）；
函数加滑块（n）{
放映幻灯片（幻灯片索引+=n）；
}
功能当前幻灯片（n）{
放映幻灯片（幻灯片索引=n）；
}
功能演示幻灯片（n）{
var i；
var slides=document.getElementsByClassName（“contents-2”）；
var slides2=document.getElementsByClassName（“contents-1”）；
var dots=document.getElementsByClassName（“dot”）；
如果（n>幻灯片长度）{
slideIndex=1
}
if（n<1）{
slideIndex=slides.length
}
对于（i=0；i

---

请帮我处理此代码，上面的代码不会自动播放，谢谢。

您可以在代码中添加间隔函数

setInterval(function(){ plusSlides(1); }, 3000);

---

我尝试的新代码如下：

var slideIndex = 1;
showSlides(slideIndex);

function plusSlides(n) {
  showSlides(slideIndex += n);
}

function currentSlide(n) {
  showSlides(slideIndex = n);
}

function showSlides(n) {
  var i;
  var slides = document.getElementsByClassName("contents-2");
  var slides2 = document.getElementsByClassName("contents-1");
  var dots = document.getElementsByClassName("dot");
  if (n > slides.length) {slideIndex = 1}    
  if (n < 1) {slideIndex = slides.length}   
  for (i = 0; i < slides.length; i++) {
      slides[i].className = slides[i].className.replace(" cont-1", "");  
  }
  for (i = 0; i < slides2.length; i++) {
slides2[i].className = slides2[i].className.replace(" cont-2", "");
  }
    for (i = 0; i < dots.length; i++) {
      dots[i].className = dots[i].className.replace(" active-page", "");
  }
  dots[slideIndex-1].className += " active-page";
  slides[slideIndex-1].className += " cont-1";  
  slides2[slideIndex-1].className += " cont-2";
  setTimeout(function() {
        showSlides(slideIndex += 1);
    }, 4000);
}

var slideIndex=1；
放映幻灯片（幻灯片索引）；
函数加滑块（n）{
放映幻灯片（幻灯片索引+=n）；
}
功能当前幻灯片（n）{
放映幻灯片（幻灯片索引=n）；
}
功能演示幻灯片（n）{
var i；
var slides=document.getElementsByClassName（“contents-2”）；
var slides2=document.getElementsByClassName（“contents-1”）；
var dots=document.getElementsByClassName（“dot”）；
如果（n>slides.length）{slideIndex=1}
如果（n<1）{slideIndex=slides.length}
对于（i=0；i

---

上面的代码工作得很好，但当我使用导航按钮时，它会以非常高的速度自动播放

代码是自动播放的，但它只显示2张幻灯片，而我使用了下面的代码：var timer；清除超时（计时器）；timer=setTimeout（函数（）{showSlides（slideIndex+=1）；}，4000）；您的代码中有slideIndex=1。也许是这样？上面的代码工作得很好，但当我使用导航按钮时，它会以非常高的速度自动播放4000表示4000毫秒=4秒应该可以正常工作。您的代码中有一个超时，可能会通过interval函数再次调用它。在那里添加自动播放会更好吗？您的导航按钮会重新加载页面或增加slideIndex？增加slideIndex我猜当您按按钮增加slideIndex时，超时是在后台等待更新，可能就在您的更新之后。您可以在设置时间的函数中执行slideIndex处理邮票。而不是在调用AutoPlay之前检查时间戳通常我会避免使用这种类型的代码。我会尝试用一个干净的函数来制作幻灯片动画，用一个干净的函数来制作幻灯片索引更新。只有一个控件。对你来说，这有点难解决。如果您有一个动画按钮，导航可以禁用动画，可能会更容易。对不起，我无能为力