如何实现几秒钟后消失的简单确认消息答案

【问题标题】：How to implement simple confirmation message that disappears after some seconds如何实现几秒钟后消失的简单确认消息
【发布时间】：2014-09-10 03:36:50
【问题描述】：

我试图在this 之后显示successfully logging out 的简单确认消息，但我不确定如何继续。

此消息将在用户单击注销按钮后显示 5 秒钟（这只是注销并重定向到主页）。此确认消息以及注销按钮位于标题处。

我将文本包裹在一个 div 中，id="confirmation"。
链接上的onClick 事件调用informUser 函数来执行此操作：

$("#confirmation").show();
setTimeout(function() { $("#myElem").hide(); }, 5000);

div 包装器的 css 是这样的：

#confirmation {
    position: absolute;
    top: 0;
    left: 45%;
    text-align: center;
    font-size: 1.25em;
}

现在，我需要隐藏此元素，我尝试使用 visibility: hidden;，但该元素从未出现。
我尝试使用

隐藏它

$(document).ready(function() {
$("#confirmation").hide("slow"); });

该元素出现了不到一秒钟，然后消失了（由于 document.ready 再次加载）。

【问题讨论】：

为什么要重新发明轮子？我的建议：改用fabien-d.github.io/alertify.js。
你看到这个问题了吗：stackoverflow.com/questions/683363/…
@Arius 我同意你，但我不允许使用其他框架
@Chris - 甚至麻省理工学院也像这样获得许可？客户的要求很奇怪:)
@Arius 不幸的是，这是大学老师提出的愚蠢要求。 :(

标签： javascript jquery html css

【解决方案1】：

这可能只是帖子中的一个错字，但我还不能离开 cmets，所以这是我的答案（以防万一）。

$("#confirmation").show();
setTimeout(function() { $("#myElem").hide(); }, 5000);

应该是

$("#confirmation").show();
setTimeout(function() { $("#confirmation").hide(); }, 5000);

【讨论】：

【解决方案2】：

因为您正在更改页面（当您重定向到主页时），处理注销按钮上的事件的 javascript 不会做任何事情来显示和隐藏主页上的消息。相反，我会尝试设置一个寿命较短的 cookie，如果设置了该 cookie，则让主页上的单独脚本处理消息的显示。

您可以在此处查看 cookie 的基本概述：http://www.quirksmode.org/js/cookies.html

【讨论】：