5 秒后 jQuery 自动隐藏元素
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/683363/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery autohide element after 5 seconds
提问by Chris Conway
Is it possible to automatically hide an element in a web page 5 seconds after the form loads using jQuery?
是否可以在使用 jQuery 加载表单后 5 秒自动隐藏网页中的元素？
Basically, I've got
基本上，我有
<div id="successMessage">Project saved successfully!</div>
that I'd like to disappear after 5 seconds. I've looked at jQuery UI and the hide effect but I'm having a little trouble getting it work the way I want it to.
我想在 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>
I'd like the click function to be removed and add a timeout method that calls the runEffect() after 5 seconds.
我希望删除单击功能并添加一个超时方法，该方法在 5 秒后调用 runEffect()。
回答by justmeol
$('#selector').delay(5000).fadeOut('slow');
回答by Konstantin Tarkus
$(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);
});
Note: In order to make you jQuery function work inside setTimeout you should wrap it inside
注意：为了让你的 jQuery 函数在 setTimeout 中工作，你应该将它包裹在里面
function() { ... }
回答by sweety
You can try :
你可以试试 ：
setTimeout(function() {
$('#successMessage').fadeOut('fast');
}, 30000); // <-- time in milliseconds
If you used this then your div will be hide after 30 sec.I also tried this one and it worked for me.
如果你使用它，那么你的 div 将在 30 秒后隐藏。我也试过这个，它对我有用。
回答by Cris
Please note you may need to display div text again after it has disappeared. So you will need to also empty and then re-show the element at some point.
请注意，您可能需要在 div 文本消失后再次显示它。因此，您还需要清空，然后在某个时候重新显示该元素。
You can do this with 1 line of code:
您可以使用 1 行代码执行此操作：
$('#element_id').empty().show().html(message).delay(3000).fadeOut(300);
If you're using jQuery you don't need setTimeout, at least not to autohide an element.
如果您使用 jQuery，则不需要 setTimeout，至少不需要自动隐藏元素。
回答by CMS
You use setTimeout on you runEffect function :
您在 runEffect 函数上使用 setTimeout ：
function runEffect() {
setTimeout(function(){
var selectedEffect = 'blind';
var options = {};
$("#successMessage").hide(selectedEffect, options, 500)
}, 5000);
}
回答by Petertje
I think, you could also do something like...
我想，你也可以做一些像......
setTimeout(function(){
$(".message-class").trigger("click");
}, 5000);
and do your animated effects on the event-click...
并在事件点击上做你的动画效果......
$(".message-class").click(function() {
//your event-code
});
Greetings,
你好，
回答by user3778023
jQuery(".success_mgs").show(); setTimeout(function(){ jQuery(".success_mgs").hide();},5000);
jQuery(".success_mgs").show(); setTimeout(function(){ jQuery(".success_mgs").hide();},5000);
回答by Aakash Pahuja
This is how you can set the timeout after you click.
这是您可以在单击后设置超时的方法。
$(".selectorOnWhichEventCapture").on('click', function() {
setTimeout(function(){
$(".selector").doWhateverYouWantToDo();
}, 5000);
});
//5000 = 5sec = 5000 milisec
//5000 = 5sec = 5000 毫秒
