jquery - この関数にコールバックを追加する

Question

この関数を見て、最後の要素のフェードインが完了した後にコールバック関数を追加して実行する方法を説明することで、誰かが私に手を差し伸べて助けてくれませんか。私が探している結果を得るためにコードを編集するか、コードを作り直してください。

コードはこちらFiddle

ありがとうございました

Answer 1

これは正確には正確な答えではありませんが、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
}