Jquery 逐个添加并单击每个子项

我有一个没有自动滚动的滑块，所以我需要一个jquery函数在滑块上添加自动滚动。这些是滑块指示器，用于更改幻灯片

<div class="slider__navi">
<a href="#" class="slide-nav" data-slide="1">pikachu</a>
<a href="#" class="slide-nav" data-slide="2">piplup</a>
<a href="#" class="slide-nav" data-slide="3">blaziken</a>
<a href="#" class="slide-nav active" data-slide="4">dialga</a>
</div>

---

但这不对，我想一个接一个地单击每个幻灯片导航，或者等待一段时间，一个接一个地添加活动类。

当您选择所有

时。幻灯片导航

然后逐个单击列表中每个项目上的事件绑定

间隔时间不对

改用这个：

    $('.slider__navi').on('click', '.slide-nav', function(){
        var target = $(this).data("slide");
        //do stuff to scroll

        // set active class
        $('.slide-nav').removeClass("active");
        $(this).addClass("active");

        // see target
        console.log(target)
    }); 

---

试试这个，

<script>
var myIndex = 0;
slideShow();

function slideShow() {
  var i;
  var x = document.getElementsByClassName("slide-nav");
  for (i = 0; i < x.length; i++) {
    x[i].style.display = "none";  
  }
  myIndex++;
  if (myIndex > x.length) {myIndex = 1}    
  x[myIndex-1].style.display = "block";  
  setTimeout(slideShow, 1000); // Change image every 1 seconds
}
</script>

var-myIndex=0；
幻灯片（）；
函数幻灯片（）{
var i；
var x=document.getElementsByClassName（“幻灯片导航”）；
对于（i=0；ix.length）{myIndex=1}
x[myIndex-1].style.display=“block”；
setTimeout（幻灯片放映，1000）；//每1秒更改一次图像
}

---

这应该可以做到

请显示您的完整代码您当前的代码设置了一个间隔计时器，当它运行时，会执行所有四个操作。您希望每个计时器只执行一次，因此不使用

for

循环。相反，您可以在索引变量上使用计时器函数close。

<script>
var myIndex = 0;
slideShow();

function slideShow() {
  var i;
  var x = document.getElementsByClassName("slide-nav");
  for (i = 0; i < x.length; i++) {
    x[i].style.display = "none";  
  }
  myIndex++;
  if (myIndex > x.length) {myIndex = 1}    
  x[myIndex-1].style.display = "block";  
  setTimeout(slideShow, 1000); // Change image every 1 seconds
}
</script>

  $(function(){
      $('.slide-nav').click(function(){
          $('.active').removeClass('active');
          $(this).addClass('active');
      });
      let currentLink = 1;
      let linkLengths = $('.slide-nav').length;
      setInterval(function(){
          $('.slide-nav:nth-child(' + currentLink++ +')').click();
          if(currentLink == linkLengths+1 ){
              currentLink = 1;
          }
      }, 1000)
});