6

以下代码块存在一些问题：

        $('.merge').each(function(index) {
            var mergeEl = $(this);
            setTimeout(function() {
                self.mergeOne(mergeEl, self, index - (length - 1));
            }, 500);
        });

我试图在每次调用之间应用 0.500 秒的延迟mergeOne，但此代码仅在mergeOne同时调用数组中的所有元素之前应用 0.500 秒的延迟。

如果有人可以解释为什么这段代码不起作用，并且可能是一个很棒的可行解决方案，谢谢！

4

1 回答 1

8

这是一个通用函数，可用于迭代 jQuery 对象的集合，每次迭代之间有一个延迟：

function delayedEach($els, timeout, callback, continuous) {
    var iterator;

    iterator = function (index) {
        var cur;

        if (index >= $els.length) {
            if (!continuous) {
                return;
            }
            index = 0;
        }

        cur = $els[index];
        callback.call(cur, index, cur);

        setTimeout(function () {
            iterator(++index);
        }, timeout);
    };

    iterator(0);
}

演示： http: //jsfiddle.net/7Ra9K/（循环一次）

演示： http: //jsfiddle.net/42tXp/（连续循环）

传递给回调的上下文和参数应该与.each()它的方式相同。

如果你想让它成为一个 jQuery 插件，所以它可以被称为$("selector").delayedEach(5000, func...，那么你可以使用这个：

$.fn.delayedEach = function (timeout, callback, continuous) {
    var $els, iterator;

    $els = this;
    iterator = function (index) {
        var cur;

        if (index >= $els.length) {
            if (!continuous) {
                return;
            }
            index = 0;
        }

        cur = $els[index];
        callback.call(cur, index, cur);

        setTimeout(function () {
            iterator(++index);
        }, timeout);
    };

    iterator(0);
};

演示： http: //jsfiddle.net/VGH25/（循环一次）

演示： http: //jsfiddle.net/NYdp7/（连续循环）

更新

我添加了连续循环遍历元素的能力，作为一个额外的参数。传递true将不断循环，而传递false或不传递（或虚假的东西）只会在元素上循环一次。代码和小提琴包括更改。

于 2013-08-10T22:28:37.587 回答