Question

我需要每1秒在each（）函数内执行一个函数。我怎么能这样做？

$('.items:visible').each(function(){
    var id = this.id;
    executeNow(i, s, id);
    count++;
    if(count==total){
       ///do something
    }
});

基本上，每次在this（）函数中调用executeNow();时，我需要有1秒的间隙。

Answer 1

您可以自己编写一个简单的 run-away-timer ，如下所示：

var set = $('.items:visible').get();

(function loop( elem ) {
    executeNow( elem );

    if( set.length ) {
        setTimeout( function() {
            loop( set.shift() );
        }, 1000 );
    }
}( set.shift() ));

这样，定时器不会干扰或重叠。经典你只需要用setTimeout来增加超时值，但上面的解决方案更清晰，更可靠。

Answer 2

jQuery.each中的第一个参数是index，可以用作setTimeout 持续时间的倍增因子

$('.items:visible').each(function(index) {
  setTimeout(executeNow, 1000 * (index + 1));
});

首先index的{{1}}为iteration，0被使用！

在调用index + 1时传递参数，

executeNow

Answer 3

尝试这种简单的方法

var ms = 1000;
var runningMS = 0;
$('.items:visible').each(function(){
    setTimeout( function(){
        executeNow();
    }, runningMS );
    runningMS += ms;
});

Answer 4

您可以使用.queue()，$.map()，.promise()

＆＃13;

var colors = ["blue", "green", "red"];

function executeNow(el, args, next) {
  el.css("color", args)
  setTimeout(next, 1000)
}

function queueComplete(elems) {
  console.log(elems);
  alert("complete");
}

var items = $(".items:visible")

items.queue("items", $.map(items, function(item, index) {
  return function(next) {
    executeNow($(item), colors[index], next);
  }
}))
.dequeue("items").promise("items")
.then(queueComplete)

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
  </script>
<div class="items">a</div>
<div class="items">b</div>
<div class="items">c</div>

＆＃13;

每个（）函数内有1秒的间隙

4 个答案: