javascript - 如何在调用下一个回调函数之前添加延迟？

Question

我正在尝试制作一个 javascript 横幅。我在一个 div 中有 3 张图片，id 为#img1、#img2 n #img3。

<script src="scripts/jquery-latest.min.js" type="text/javascript"></script> 
<script> 
    var AnimState = true;
    var AnimTime = 2000;
    var AnimDelay = 3000;
    $(document).ready( function()
    {
        $('#image img').hide();
        $('#img3').show();
        Show1();
    });
    function Show1()
    {
        if( AnimState === true )
        {
            $("#img3").fadeOut(AnimTime);
            $("#img1").fadeIn(AnimTime, Show2);
        }
    }
    function Show2()
    {
        if( AnimState === true )
        {
            $("#img1").fadeOut(AnimTime);
            $("#img2").fadeIn(AnimTime, Show3);
        }
    }
    function Show3()
    {
        if( AnimState === true )
        {
            $("#img2").fadeOut(AnimTime);
            $("#img3").fadeIn(AnimTime, Show1);
        }
    }
    $('#btn1').click( function()
    {
       AnimState = !AnimState;
       Show1(); 
    }); 
</script> 

它工作正常。唯一的问题是，现在我想在淡入淡出效果后添加延迟，但尝试 diff 东西我失败了。那么可以做些什么来增加几分钟的延迟，然后只调用下一个函数，即。我想在 $("#img3").fadeIn(AnimTime) 之后添加延迟，并且在延迟之后只调用 Show1() 函数

Answer 1

好的，试试这个。在你的动画之后:

$("#img1").fadeOut(AnimTime);
$("#img2").fadeIn(AnimTime);
setTimeout(Show3, 30000); //delays next call for 30 seconds