几秒钟后隐藏div

I was wondering, how in jquery am I able to hide a div after a few seconds? Like Gmail's messages for example.

我想知道，如何在jquery中隐藏div ?比如Gmail的消息。

I've tried my best but am unable to get it working.

我已尽了最大的努力，但仍未成功。

7 个解决方案

#1

213

This will hide the div after 1 second (1000 milliseconds).

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

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

If you just want to hide without fading, use hide().

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

#2

You can try the .delay()

您可以尝试.delay()

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

call the div set the delay time in milliseconds and set the property you want to change, in this case I used .fadeOut() so it could be animated, but you can use .hide() as well.

调用div设置延迟时间(以毫秒为单位)，并设置要更改的属性，在本例中，我使用了. fadeout()，因此可以对其进行动画处理，但也可以使用.hide()。

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

#3

There's a really simple way to do this.

有一个很简单的方法。

The problem is that .delay only effects animations, so what you need to do is make .hide() act like an animation by giving it a duration.

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

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

$(" #无论").delay()hide(1);

By giving it a nice short duration, it appears to be instant just like the regular .hide function.

给它一个很短的持续时间，它看起来就像普通的。hide函数。

#4

$.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);
}

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

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

(Allows chaining of methods)

(允许链接的方法)

#5

jquery offers a variety of methods to hide the div in a timed manner that do not require setting up and later clearing or resetting interval timers or other event handlers. Here are a few examples.

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

Pure hide

纯隐藏

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

Animated hide

动画隐藏

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

fade out

淡出

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

Additionally, the methods can take a queue name or function as a second parameter (depending on method). Documentation for all the calls above and other related calls can be found here: https://api.jquery.com/category/effects/

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

#6

Using the jQuery timer will also allow you to have a name associated with the timers that are attached to the object. So you could attach several timers to an object and stop any one of them.

使用jQuery计时器还允许您将名称与附加到对象的计时器关联。所以你可以在一个对象上附加几个计时器并停止其中的任何一个。

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

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

The eval function (and its relatives, Function, setTimeout, and setInterval) provide access to the JavaScript compiler. This is sometimes necessary, but in most cases it indicates the presence of extremely bad coding. The eval function is the most misused feature of JavaScript.

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

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

#7

Probably the easiest way is to use the timers plugin. http://plugins.jquery.com/project/timers and then call something like

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

$(this).oneTime(1000, function() {
    $("#something").hide();
  });

#1

213