几秒钟后隐藏 div

IT技术 javascript jquery timing
2021-01-12 13:01:21

我想知道,几秒钟后我如何在 jquery 中隐藏 div?例如 Gmail 的邮件。

我已经尽力了,但无法让它工作。

6个回答

这将在 1 秒(1000 毫秒)后隐藏 div。

setTimeout(function() {
    $('#mydiv').fadeOut('fast');
}, 1000); // <-- time in milliseconds
#mydiv{
    width: 100px;
    height: 100px;
    background: #000;
    color: #fff;
    text-align: center;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="mydiv">myDiv</div>

如果您只想隐藏而不褪色,请使用hide().

而且一枪就击败了疯狂的乔尔·科霍恩 (Joel Coehoorn):)
2021-03-19 13:01:21
你可以替换.fadeOut('fast')使用.hide()的DIV的瞬间隐藏。
2021-03-19 13:01:21
@James,当然最终结果没有区别,但我认为使用的实现.delay()对于jQuery.
2021-03-26 13:01:21

你可以试试 .delay()

$(".formSentMsg").delay(3200).fadeOut(300);

调用 div 以毫秒为单位设置延迟时间并设置您想要更改的属性,在本例中我使用了 .fadeOut() 因此它可以被动画化,但您也可以使用 .hide() 。

http://api.jquery.com/delay/

这更好,因为我不必使用 setTimeout 并且代码更易于阅读。
2021-04-01 13:01:21

jquery 提供了多种以定时方式隐藏 div 的方法,这些方法不需要设置和稍后清除或重置间隔计时器或其他事件处理程序。这里有一些例子。

纯隐藏,一秒延迟

// hide in one second
$('#mydiv').delay(1000).hide(0); 

纯隐藏,无延迟

// hide immediately
$('#mydiv').delay(0).hide(0); 

动画隐藏

// start hide in one second, take 1/2 second for animated hide effect
$('#mydiv').delay(1000).hide(500); 

逐渐消失

// start fade out in one second, take 300ms to fade
$('#mydiv').delay(1000).fadeOut(300); 

此外,这些方法可以采用队列名称或函数作为第二个参数(取决于方法)。可以在此处找到上述所有调用和其他相关调用的文档:https : //api.jquery.com/category/effects/

有一种非常简单的方法可以做到这一点。

问题是 .delay 只影响动画,所以你需要做的是通过给它一个持续时间让 .hide() 表现得像一个动画。

$("#whatever").delay().hide(1);

通过给它一个很好的短暂持续时间,它看起来就像常规的 .hide 功能一样即时。

这对我有帮助。明确你必须给hide()传递一些值,否则delay()不会被触发。
2021-04-04 13:01:21
$.fn.delay = function(time, callback){
    // Empty function:
    jQuery.fx.step.delay = function(){};
    // Return meaningless animation, (will be added to queue)
    return this.animate({delay:1}, time, callback);
}

来自http://james.padolsey.com/javascript/jquery-delay-plugin/

(允许链接方法)