使用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>
我希望删除click函数并添加一个在5秒后调用runEffect()的超时方法。
mucho gracias!
答案 0 :(得分:195)
$('#selector').delay(5000).fadeOut('slow');
答案 1 :(得分:105)
$(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);
});
注意:为了让你在setTimeout中使用jQuery函数你应该把它包装在里面
function() { ... }
答案 2 :(得分:8)
您可以尝试:
setTimeout(function() {
$('#successMessage').fadeOut('fast');
}, 30000); // <-- time in milliseconds
如果你使用了这个,那么你的div将在30秒后隐藏。我也试过这个,它对我有效。
答案 3 :(得分:1)
您在runEffect函数上使用setTimeout:
function runEffect() {
setTimeout(function(){
var selectedEffect = 'blind';
var options = {};
$("#successMessage").hide(selectedEffect, options, 500)
}, 5000);
}
答案 4 :(得分:1)
我想,你也可以做点像......
setTimeout(function(){
$(".message-class").trigger("click");
}, 5000);
并在事件点击中进行动画效果...
$(".message-class").click(function() {
//your event-code
});
问候,
答案 5 :(得分:0)
这是您点击后设置超时的方法。
$(".selectorOnWhichEventCapture").on('click', function() {
setTimeout(function(){
$(".selector").doWhateverYouWantToDo();
}, 5000);
});
// 5000 = 5sec = 5000 milisec
答案 6 :(得分:0)
请注意,您可能需要在消失后再次显示div文本。 因此,您还需要清空,然后在某个时刻重新显示该元素。
您可以使用1行代码执行此操作:
$('#element_id').empty().show().html(message).delay(3000).fadeOut(300);
如果您正在使用jQuery,则不需要setTimeout,至少不要自动隐藏元素。
答案 7 :(得分:0)
jQuery(“。success_mgs”)。show(); setTimeout(function(){jQuery(“。success_mgs”)。hide();},5000);