jQuery setInterval和clearInterval

乔西·坎南(Jothi Kannan)

我要一个突出显示一个列表项,一旦到达最后一个列表项,则应删除突出显示

setInterval在工作,但是当我使用clearInterval删除Interval时,它不起作用

<ul>
  <li><a href="#" class="anchor">I am an anchor</a></li>
  <li><a href="#" class="anchor">I am an anchor</a></li>
  <li><a href="#" class="anchor">I am an anchor</a></li>
  <li><a href="#" class="anchor">I am an anchor</a></li>
  <li><a href="#" class="anchor">I am an anchor</a></li>
</ul>


var $anchors = $('a.anchor'), counter = 0;
var interval;
interval = setInterval(function(){
 $anchors.removeClass('highlight');
  $anchors.eq(counter++ % $anchors.length).addClass('highlight');
    if($anchors.length==5){
    clearInterval(interval);
}
}, 4000);

无论如何要清除到达最终列表项的时间间隔?

小提琴链接:演示

更新:对不起,我的代码是错误的,更正了代码,仍然是同样的问题

xAqweRx

如果要突出显示最后一个:

 var $anchors = $('a.anchor'), counter = 0;
    var interval;
    interval = setInterval(function(){
      $anchors.removeClass('highlight');
      $anchors.eq(counter++ % $anchors.length).addClass('highlight');
    	if($anchors.length == counter){
    		clearInterval(interval);
      }
    }, 1000);
.highlight{
    color:red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li><a href="#" class="anchor">I am an anchor</a></li>
  <li><a href="#" class="anchor">I am an anchor</a></li>
  <li><a href="#" class="anchor">I am an anchor</a></li>
  <li><a href="#" class="anchor">I am an anchor</a></li>
  <li><a href="#" class="anchor">I am an anchor</a></li>
</ul>


如果您不突出显示最后一个

var $anchors = $('a.anchor'), counter = 0;
var interval;
interval =setInterval(function(){
  $anchors.removeClass('highlight');
  if($anchors.length==counter){
	  clearInterval(interval);
      return;
   }
  $anchors.eq(counter++ % $anchors.length).addClass('highlight');
   
}, 1000);
.highlight{
    color:red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li><a href="#" class="anchor">I am an anchor</a></li>
  <li><a href="#" class="anchor">I am an anchor</a></li>
  <li><a href="#" class="anchor">I am an anchor</a></li>
  <li><a href="#" class="anchor">I am an anchor</a></li>
  <li><a href="#" class="anchor">I am an anchor</a></li>
</ul>

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

jQuery setInterval和clearInterval

来自分类Dev

JavaScript / Jquery clearInterval & setInterval 多个滑块

来自分类Dev

setInterval和jquery

来自分类Dev

如何在jQuery中的函数外部调用clearInterval?在setInterval之外

来自分类Dev

如何在jQuery中的函数外部调用clearInterval?在setInterval之外

来自分类Dev

React中的setInterval()和clearInterval()

来自分类Dev

jQuery mouseleave和clearInterval无法正常工作

来自分类Dev

setInterval和clearInterval使用相同的按钮?

来自分类Dev

if else语句中的clearInterval和setInterval

来自分类Dev

如何正确使用 setInterval 和 clearInterval

来自分类Dev

在哪里放置 setInterval 和 clearInterval

来自分类Dev

clearInterval和jQuery ...未定义!+小提琴

来自分类Dev

重置耗用的时间和setInterval在jQuery中?

来自分类Dev

setInterval和clearInterval的Ember实现是什么

来自分类Dev

完成所有动画后的clearInterval()和setInterval()

来自分类Dev

JavaScript中的setInterval和clearInterval作为单线程语言

来自分类Dev

在多个javascript对象中调用setInterval和clearInterval函数

来自分类Dev

如何在同一函数中使用setInterval()和clearInterval()

来自分类Dev

需要帮助以在Javascript中使用setInterval和clearInterval

来自分类Dev

JavaScript:setInterval和clearInterval,哪种方法正确?

来自分类Dev

完成所有动画后的clearInterval()和setInterval()

来自分类Dev

如何将setInterval和clearInterval用作函数

来自分类Dev

为什么我无法控制 setinterval 和 clearinterval javascript?

来自分类Dev

jQuery clearInterval问题

来自分类Dev

jQuery clearInterval拒绝工作

来自分类Dev

clearInterval不清除setInterval

来自分类Dev

setInterval / clearInterval问题

来自分类Dev

有关jQuery hover(),setInterval范围和“ this”问题的问题-

来自分类Dev

在jquery的setInterval()和setTimeout()中使用十六进制

Related 相关文章

  1. 1

    jQuery setInterval和clearInterval

  2. 2

    JavaScript / Jquery clearInterval & setInterval 多个滑块

  3. 3

    setInterval和jquery

  4. 4

    如何在jQuery中的函数外部调用clearInterval?在setInterval之外

  5. 5

    如何在jQuery中的函数外部调用clearInterval?在setInterval之外

  6. 6

    React中的setInterval()和clearInterval()

  7. 7

    jQuery mouseleave和clearInterval无法正常工作

  8. 8

    setInterval和clearInterval使用相同的按钮?

  9. 9

    if else语句中的clearInterval和setInterval

  10. 10

    如何正确使用 setInterval 和 clearInterval

  11. 11

    在哪里放置 setInterval 和 clearInterval

  12. 12

    clearInterval和jQuery ...未定义!+小提琴

  13. 13

    重置耗用的时间和setInterval在jQuery中?

  14. 14

    setInterval和clearInterval的Ember实现是什么

  15. 15

    完成所有动画后的clearInterval()和setInterval()

  16. 16

    JavaScript中的setInterval和clearInterval作为单线程语言

  17. 17

    在多个javascript对象中调用setInterval和clearInterval函数

  18. 18

    如何在同一函数中使用setInterval()和clearInterval()

  19. 19

    需要帮助以在Javascript中使用setInterval和clearInterval

  20. 20

    JavaScript:setInterval和clearInterval,哪种方法正确?

  21. 21

    完成所有动画后的clearInterval()和setInterval()

  22. 22

    如何将setInterval和clearInterval用作函数

  23. 23

    为什么我无法控制 setinterval 和 clearinterval javascript?

  24. 24

    jQuery clearInterval问题

  25. 25

    jQuery clearInterval拒绝工作

  26. 26

    clearInterval不清除setInterval

  27. 27

    setInterval / clearInterval问题

  28. 28

    有关jQuery hover(),setInterval范围和“ this”问题的问题-

  29. 29

    在jquery的setInterval()和setTimeout()中使用十六进制

热门标签

归档