jquery - 延迟 5 秒后用文本替换图像

Question

目标
使用 jQuery 在延迟 5 秒后将一个 div 替换为另一个。

描述
我想在一个 div 中显示一个图像 5 秒，然后它应该被另一个 div 中的文本替换。

HTML 代码

<div id="outer">Image here</div>
<div id="text">Text here</div>

jQuery 代码

<script type="text/javascript">
    $(document).ready(function()
    {
        setTimeout(function()
        {
            $("div#outer").fadeOut("slow", function ()
            {
                $("div#outer").remove();
            });
         }, 5000);
     });
</script>

提前致谢。

Answer 1

试试这个:

<script type="text/javascript">
        $(document).ready(function()
        {
            setTimeout(function()
            {
                $("div#outer").fadeOut("slow", function ()
                {
                    $("div#outer").hide();
                    $("div#text").show();
                });
             }, 5000);
         });
    </script>

或者，如果您实际上想将 div text 中包含的文本移动到 div outer 中，请执行以下操作:

<script type="text/javascript">
            $(document).ready(function()
            {
                setTimeout(function()
                {
                    $("div#outer").fadeOut("slow", function ()
                    {
                        $("div#outer").html($("div#text").html()); //.html or .text
                    });
                 }, 5000);
             });
        </script>