运行一次setInterval,然后停止

Run setInterval once and then stop

本文关键字:然后 setInterval 一次 运行      更新时间:2023-09-26

我目前正在将一个"active"类应用于一组列表项。您可以在这里看到小提琴:

http://jsfiddle.net/y9h5q/906/

编辑:这是HTML:
<div id="slider">
  <ul>
    <li class='active'> a </li>
    <li> b &lt; </li>
    <li> c &lt; </li>    
    <li> d &lt; </li>
    <li> e &lt; </li>
  </ul>
</div>

…这里是javascript:

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

我希望setInterval只运行一次,在最后一个列表项之后停止。

我不确定是否使用setInterval或setTimeout?

你的意思是:http://jsfiddle.net/xELsc/?

[编辑:添加脚本]
像这样修改你的js:

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

我是这么想的:

var toggleSlide = setInterval(function() {
    if ($("#slider li.wasActive").length == $("#slider li").length) {
        clearInterval(toggleSlide);
    } else {
        $("#slider li.active")
            .removeClass("active")
            .addClass("wasActive")
            .next()
            .addClass("active");
    }
    }, 300);
$("li").click(function() {
    clearInterval(toggleSlide);
});

显然不像CrisDeBlonde那样方便和简短,但仍然有效。此外,为了可读性起见,我链接了您的jQuery。