jQuery fadeOut回調永遠不會觸發

Question

因此，我嘗試使用jQuery創建一個非常簡單的動畫，但不會發生fadeOut的回調。

這是下面的代碼：

var move = function(target, speed) {
    $(target).delay(200).animate({bottom: "-=20"},
        speed,
        function() {
            $(this).fadeOut(200, function() {
                $(this).css("bottom", "+=20");
            });
            $(this).fadeIn(200);
        }
    );
    move(target, speed);
};

move(".fa-arrow-down", 500);

我嘗試了幾種不同的操作，例如在控制台中進行檢出，設置各種斷點（主要在$(this).css("bottom", "+=20"); ;，此行上方和此下方）線）。

我不太確定為什么沒有發生。 感謝您的幫助，如果可以的話，請您解釋一下實際問題所在，以便我也能學習。 這是一個小提琴 。

Answer 1

您需要將move(target, speed)的調用move(target, speed) fadeIn的完整功能內部。

演示

var move = function (target, speed) {
    $(target).delay(200).animate({
        bottom: "-=20"
    },
    speed,

    function () {
        $(this).fadeOut(200, function () {
            $(this).css("bottom", "+=20");
        });
        $(this).fadeIn(200, function () {
            move(target, speed);


        });
    });
};

move(".fa-arrow-down", 500);

但是我不能承擔所有的功勞... Cookie怪物最先看到遞歸錯誤。 就像他說的那樣，之所以有效，是因為每次調用move（）都會增加延遲

就像我剛才說的，您立即調用move（）而不是等待回調。 這意味着它以等於調用.delay（）。animate（）的時間的頻率來調用move（），而無需等待它們完成。 換句話說，即使第一個.delay（）完成之前，move（）也會被數萬次調用-cookie 怪物