javascript - 隐藏的 div 显示 3 秒并点击关闭

Question

我正在寻找 jquery 或 javascript 来执行此操作:

页面加载时 div 将被隐藏然后，如果我单击按钮，div 将出现 3 秒并关闭

我在此链接 http://papermashup.com/demos/jquery-divfade.html 中找到了 3 秒后自动隐藏 div 的示例

以及在此链接中显示 div 的示例 http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_hide_show

如何结合这两个示例？我需要在页面加载时隐藏 div仅当单击按钮时，div 才会出现 3 秒

这就是我到目前为止所拥有的。

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

    $("#btnAddRow").click(function () {
        $("div.mydiv").show();
    });
});
</script>

淡出超时功能正在发挥作用。但我需要将 div 设置为隐藏在开头。当我隐藏div时。点击功能似乎没有让它显示出来

HTML

<div class="mydiv"  style="visibility: hidden; ">test</div>

我也尝试过:

<div class="mydiv"  style="display: none;">test</div>

Answer 1

$("div.mydiv").remove();

更改为:

$("div.mydiv").hide();