1

I am trying to create the following functionality in my javascript:

$("mySelector").each(function(){

// Do something (e.g. change div class attribute)   
// call to MyFunction(), the iteration will stop here as long as it will take for myFunction to complete

});

function myFunction() 
{   
 // Do something for e.g. 5 seconds 
}

My question is how can I stop every iteration for the duration of the myFunction()?

4

3 回答 3

3

No, that isnt possible. You'll have to code it differently, possibly with a setTimeout based on the current index of .each.

$("mySelector").each(function(i){

    // Do something (e.g. change div class attribute)   
    // call to MyFunction(), the iteration will stop here as long as it will take for myFunction to complete
    setTimeout(myFunction,i*5000);

});

function myFunction() 
{   
 // Do something for e.g. 5 seconds 
}

Edit: You can also do it with queuing: http://jsfiddle.net/9Bm9p/6/

$(document).ready(function () {
    var divs = $(".test");
    var queue = $("<div />");

    divs.each(function(){
        var _this = this;
        queue.queue(function(next) {
            myFunction.call(_this,next); 
        });
    });
});

function myFunction(next) {    
    // do stuff
    $(this).doSomething(); 

    // simulate asynchronous event
    var self = this;
    setTimeout(function(){
        console.log(self.id);
        // go to next item in the queue
        next();
    },2000);

}

​</p>

于 2012-09-12T20:31:16.143 回答
2

这是一个 jsFiddle，我认为它可以满足您的需要：

http://jsfiddle.net/9Bm9p/2/

您只需将选择器替换为您使用的选择器。

正在发生的“循环”将等待myFunction完成，然后再继续下一个元素。我在里面添加了 setTimeoutmyFunction来模拟它需要一段时间。如果您正在使用异步的东西，例如 AJAX 请求，您需要将调用myFunction放在complete方法内部......或动画的回调中。

但是正如有人已经评论过的那样，如果其中的所有内容myFunction都是同步的，那么您应该可以按原样使用它。如果您希望此过程是异步的，或者如果其中的内容myFunction是异步的，则不能使用 for 循环或 .each()。

于 2012-09-12T21:06:47.167 回答
1 
(function () {
    "use strict";

    var step = 0;
    var content = $("mySelector");
    var max = content.length;
    var speed = 5000; // ms


    var handle = setInterval(function () {
        step++;
        if (step >= max) {
            clearInterval(handle);
        } else {
            var item = content[step];
            // do something
        }
    }, speed);
}());

setInterval每n毫秒执行一次，clearInterval完成后停止。这不会锁定浏览器（前提是您的“做某事”也没有）。 FRAGILE：假设 的结果$("mySelector")在任务期间有效。如果不是这种情况，那么在里面do something然后item再次验证。

于 2012-09-12T20:41:25.833 回答