134

我想知道，几秒钟后我如何在 jquery 中隐藏一个 div？例如 Gmail 的邮件。

我已尽力而为，但无法使其正常工作。

4

9 回答 9

271

这将在 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().

于 2009-05-04T17:03:31.187 回答
93

你可以试试.delay()

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

调用 div 以毫秒为单位设置延迟时间并设置要更改的属性，在这种情况下，我使用了 .fadeOut() 以便它可以动画，但您也可以使用 .hide() 。

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

于 2011-09-23T16:56:10.190 回答
13

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/

于 2016-04-04T17:16:12.533 回答
11

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

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

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

通过给它一个不错的短持续时间，它看起来就像常规的 .hide 函数一样是即时的。

于 2012-06-21T13:08:38.763 回答
6 
$.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/

（允许链接方法）

于 2009-05-04T17:06:29.620 回答
3

使用 jQuery 计时器还可以让您拥有与附加到对象的计时器相关联的名称。因此，您可以将多个计时器附加到一个对象并停止其中任何一个。

$("#myid").oneTime(1000, "mytimer1" function() {
  $("#something").hide();
}).oneTime(2000, "mytimer2" function() {
  $("#somethingelse").show();  
});

$("#myid").stopTime("mytimer2");

eval 函数（及其相关函数，Function、setTimeout 和 setInterval）提供对 JavaScript 编译器的访问。这有时是必要的，但在大多数情况下，它表明存在极其糟糕的编码。eval 函数是 JavaScript 中被滥用最多的特性。

http://www.jslint.com/lint.html

于 2009-05-04T22:20:26.450 回答
2

可能最简单的方法是使用计时器插件。 http://plugins.jquery.com/project/timers然后调用类似

$(this).oneTime(1000, function() {
    $("#something").hide();
  });
于 2009-05-04T17:05:02.743 回答
2 
<script>
    $(function() {
        $(".hide-it").hide(7000);
    });              
</script>

<div id="hide-it">myDiv</div>
于 2020-07-02T07:05:16.913 回答
0

我们可以直接使用

$('#selector').delay(5000).fadeOut('slow');
于 2019-02-16T09:38:26.667 回答