jQuery 显示 5 秒然后隐藏答案

【问题标题】：jQuery show for 5 seconds then hidejQuery 显示 5 秒然后隐藏
【发布时间】：2011-03-26 14:51:54
【问题描述】：

我正在使用.show 在成功提交表单后显示隐藏消息。

如何将消息显示5秒然后隐藏？

【问题讨论】：

【解决方案1】：

您可以在动画前使用.delay()，如下所示：

$("#myElem").show().delay(5000).fadeOut();

如果不是动画，直接使用setTimeout()，像这样：

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

您选择第二个是因为.hide() 通常不会出现在没有持续时间的动画 (fx) 队列中，这只是一个即时效果。

或者，另一种选择是自己使用.delay() 和.queue()，如下所示：

$("#myElem").show().delay(5000).queue(function(n) {
  $(this).hide(); n();
});

【讨论】：

建议 2 与显示复选标记图标并使用 fadeOut() 而不是 hide() 完美配合。很好的答案。
@wilsjd 不，你不能，.delay() 将无法与 .hide() 一起使用，该元素将显示然后立即隐藏。请参阅this jsFiddle 这就是为什么尼克说“如果它不是动画，请直接使用 setTimeout()，如下所示：....”
嗯，我想知道两年前这是否有效。不过很好找。谢谢你让我诚实。
我也实现了这个，但是当我在 5 秒内显示两次 msg 时，它应该隐藏 prev 并重新显示，而它不会重置 first 的延迟

【解决方案2】：

您可以使用以下效果进行动画处理，您可以根据需要更改值

$("#myElem").fadeIn('slow').animate({opacity: 1.0}, 1500).effect("pulsate", { times: 2 }, 800).fadeOut('slow');

【讨论】：

$(...).fadeIn(...).animate(...).effect 不是 JQuery 2.1.3 中的函数
@DustinCharles 添加 jQueryUI 而不仅仅是 jQuery。 jQuery 不包含 effect() 函数，例如code.jquery.com/ui/1.12.0/jquery-ui.min.js

【解决方案3】：

就这么简单：

$("#myElem").show("slow").delay(5000).hide("slow");

【讨论】：