使用JQuery通过计时器迭代元素

Question

我试图使用JQuery使用计时器迭代一些<li>对象,即 - 每5秒,我想访问我的<ul>的下一个<li>对象.

我知道您可以使用.each函数进行迭代,但是我在将计时器与它集成时无法单独迭代每个计时器.

我尝试了以下,但它无法正常工作.它一直给我最后的LI元素.我假设这是因为setTimeout不是顺序的.

$("#div_image_thumb ul li").each(function(){    
  var myLIobj = $(this);
  setTimeout(function(){doThis(myLIobj);}, 5000);
});

Answer 1

John Fishers的方法看起来不错.但是如果你想坚持jQuery的每个,这是非常优雅的,试试这个(根据JasonWoof的提示将超时设置为5s,10s等):

$("#div_image_thumb ul li").each(function (i) {
    var $li = $(this);
    setTimeout(function () { doThis($li); }, 5000 * (i + 1));
});

Answer 2

像这样的东西应该正常工作:

var elements = $("#div_image_thumb ul li");
var index = 0;

var doNext = null;
doNext = function() {
  var element = elements.eq(index);
  // do work 
  if (index < elements.length) {
    index++;
    setTimeout(doNext, 5000);
  }
}