jquery - 向此函数添加回调

Question

有人介意帮我看看这个函数并解释我如何在最后一个元素完成淡入后添加和执行回调函数来帮助我。我不确定我应该如何适应它输入或重新编写代码以获得我正在寻找的结果。

代码在这里小提琴

谢谢

Answer 1

这不是一个很好的答案，但一种方法是简单地评估是否存在next()元素并重新调用函数或执行不同的操作：

function elFadeIn(elem) {
    elem.fadeIn('slow', function() {
        if ($(this).next().length) {
            elFadeIn($(this).next());
        }
        else {
            alert('finished');
        }
    });
}​

JS 小提琴演示。

还有一种更漂亮的写作方式是：

function elFadeIn(elem, callback) {
    elem.fadeIn('slow', function() {
        var next = $(this).next(),
            action = next.length ? elFadeIn(next) : alert('finished!');
    });
}​

JS 小提琴演示。

Answer 2

使用回调只不过是将函数作为参数传递，并在特定时间调用该函数。作为旁注，我怀疑您想要所有.item元素，但.next不关心原始选择器。http://jsfiddle.net/4Pvmq/6/

$(function(){
    elFadeIn('.item', function() {
        alert("done");
    });
});

function elFadeIn(selector, callback) {
    var $items = $(selector);

    // this is the function that's going to be called recursively
    (function fade(i) {
        var $elem = $items.eq(i);

        if($elem.length) {  // there is an element
            $elem.fadeIn('slow', function() {  // fade it
                fade(i + 1);
            });
        } else {  // no elements left
            callback();
        }
    })(0);  // start with first
}