jQuery：如何等到fadeTo（或任何其他效果）完成之后再執行代碼

Question

我正在制作一個新聞板，淡入淡出新聞。 當元素淡出時，內容將被刪除，而當元素淡出時，其位置將包含新內容。 這是可行的，只是時間到了。 僅當舊內容淡出后才應顯示的新內容會隨着元素的褪色而出現。 有沒有辦法等到完成？

$(document).ready(function() {
    var counter = 0;
    var slides = ['<p>Track All of Your enemys Using The <span>Scout Tool!</span></p>',
                    '<p>Download powerups Using The <span>Pirate Tool!</span></p>',
                    '<p>Gather Badges To Attack others in <span>Raids!</span></p>',
                    '<p>Enjoy Orgainzing Your Profile <span>Join Now!</span></p>'];

    $('#slide-left').click(function() {
        $('#slide').fadeTo('fast', 0);
        $('#slide p').remove();

        if (counter > 0){counter --;}

        $('#slide').append(slides[counter]);
        $('#slide').fadeTo('fast', 1);
    });
    $('#slide-right').click(function() {
        $('#slide').fadeTo('fast', 0);
        $('#slide p').remove();

        if (counter < (slides.length-1)){counter ++;}

        $('#slide').append(slides[counter]);
        $('#slide').fadeTo('fast', 1);

    });

});

Answer 1

fadeTo接受第三個參數，即回調函數 。 動畫完成時將調用此方法。 因此，您始終可以執行以下操作：

$('#slide').fadeTo('fast', 1, function() {

    // This part is executed after fade

});

Answer 2

你可以做

$('#slide').fadeTo('fast', 0,function(){
     $('#slide p').remove();
     if (counter > 0){counter --;}
     $('#slide').append(slides[counter]).fadeTo('fast', 1);
});

Answer 3

$(document).ready(function() {
    var counter = 0;
    var slides = ['<p>Track All of Your enemys Using The <span>Scout Tool!</span></p>',
                    '<p>Download powerups Using The <span>Pirate Tool!</span></p>',
                    '<p>Gather Badges To Attack others in <span>Raids!</span></p>',
                    '<p>Enjoy Orgainzing Your Profile <span>Join Now!</span></p>'];

    $('#slide-left').click(function() {
        $('#slide').fadeTo('fast', function() {
            $('#slide p').remove();
            if (counter > 0){
                counter --;
            }else{
                if (counter < (slides.length-1)){
                    counter ++;
                }
            }
            $('#slide').append(slides[counter]);
            $('#slide').fadeTo('fast', 1);
        });
    });
});

我不知道這是正確還是錯誤，但我的5條消息：

希望我有所幫助，