jQuery自动隐藏元素5秒后

使用jQuery加载表单5秒后，是否可以自动隐藏网页中的元素？

基本上，我有

<div id="successMessage">Project saved successfully!</div> 

我想在5秒后消失。 我已经看了jQuery UI和隐藏效果，但我有点麻烦得到它的工作方式，我想要的。

 <script type="text/javascript"> $(function() { function runEffect() { var selectedEffect = 'blind'; var options = {}; $("#successMessage").hide(selectedEffect, options, 500); }; $("#successMessage").click(function() { runEffect(); return false; }); }); </script> 

我想要删除点击function，并添加一个超时方法，5秒后调用runEffect（）。

mucho gracias！

Answer 1

 $(function() { // setTimeout() function will be fired after page is loaded // it will wait for 5 sec. and then will fire // $("#successMessage").hide() function setTimeout(function() { $("#successMessage").hide('blind', {}, 500) }, 5000); }); 

注意 ：为了让你的jQuery函数在setTimeout里面工作，你应该把它包装进去

 function() { ... } 

Answer 2

 $('#selector').delay(5000).fadeOut('slow'); 

Answer 3

你可以试试 ：

 setTimeout(function() { $('#successMessage').fadeOut('fast'); }, 30000); // <-- time in milliseconds 

如果你使用这个，那么你的div将在30秒后隐藏起来。我也试过这个，它对我有用。

Answer 4

你在runEffect函数中使用setTimeout：

 function runEffect() { setTimeout(function(){ var selectedEffect = 'blind'; var options = {}; $("#successMessage").hide(selectedEffect, options, 500) }, 5000); } 

Answer 5

我想，你也可以做一些像…

 setTimeout(function(){ $(".message-class").trigger("click"); }, 5000); 

并在事件点击做你的animation效果…

 $(".message-class").click(function() { //your event-code }); 

问候，

Answer 6

点击后，您可以设置超时时间。

 $(".selectorOnWhichEventCapture").on('click', function() { setTimeout(function(){ $(".selector").doWhateverYouWantToDo(); }, 5000); }); 

// 5000 = 5秒= 5000毫秒

Answer 7

请注意，您可能需要在消失后再次显示div文本。 所以你需要清空，然后在某个时候重新显示元素。

你可以用1行代码来做到这一点：

 $('#element_id').empty().show().html(message).delay(3000).fadeOut(300); 

如果你使用jQuery，你不需要setTimeout，至less不要自动隐藏一个元素。