JQuery - 使用计时器循环一个类

Question

我在结构下面列出了一个清单

<div id="slider">
  <ul>
    <li class='active'> a </li>
    <li> b </li>
    <li> c </li>    
    <li> d </li>
    <li> e </li>
  </ul>
</div>

我需要以循环的方式改变li的类'active'这是我正在使用的脚本.问题是它是将所有类添加到活动的 li还是从所有li中删除活动的类

      toggleSlide = function(){
          $("#slider ul li").each(function(index) {
            if($(this).hasClass('active')){

              $("#slider ul li").removeClass('active');
              $(this).next().addClass('active'));
              //lis = $("#slider ul li")
              //$(lis[(index+1)%lis.length]).addClass('active');
            }
          });
        }
   setInterval(toggleSlide, 5000);?

Answer 1

您可以大大简化与此.add()并.last()因为从元素.add()被打开文件命令,它应该是这样的:

var toggleSlide = function(){
  $("#slider li.active").removeClass()
   .next().add("#slider li:first").last().addClass("active");
}
setInterval(toggleSlide, 5000);

你可以在这里测试一下(演示时间为1000ms)

这是如何工作的,<li> 如果有一个,则需要下一个,然后添加第一个,通过使用.last()(因为它们按文档顺序)我们将得到.next()一个,如果它在那里,否则该集只包含一个元素,对了,我们又回到了起点.:first <li>