Wie kann man mit jQuery 5 Sekunden warten?

Question

Ich versuche, einen Effekt zu erzeugen, bei dem die Seite geladen wird und nach 5 Sekunden die Erfolgsmeldung auf dem Bildschirm ausgeblendet wird oder nach oben gleitet.

Wie kann ich das erreichen?

Answer 1

Eingebautes Javascript setTimeout .

setTimeout(
  function() 
  {
    //do something special
  }, 5000);

UPDATE : Sie wollen warten, bis die Seite fertig geladen ist, also fügen Sie diesen Code in Ihre $(document).ready(...); Drehbuch.

UPDATE 2 jquery 1.4.0 führte die .delay Methode. Überprüfen Sie es . Beachten Sie, dass .delay nur mit den jQuery-Effekt-Warteschlangen funktioniert.

Answer 2

Verwenden Sie einen normalen Javascript-Timer:

$(function(){
   function show_popup(){
      $("#message").slideUp();
   };
   window.setTimeout( show_popup, 5000 ); // 5 seconds
});

Damit wird 5 Sekunden gewartet, nachdem das DOM fertig ist. Wenn Sie warten wollen, bis die Seite tatsächlich fertig ist loaded müssen Sie dies verwenden:

$(window).load(function(){
   function show_popup(){
      $("#message").slideUp();
   };
   window.setTimeout( show_popup, 5000 ); // 5 seconds
})

EDITAR: Als Antwort auf den Kommentar des OPs, der fragte, ob es eine Möglichkeit gibt, dies in jQuery zu tun und nicht zu verwenden setTimeout lautet die Antwort nein. Aber wenn Sie es mehr "jQueryish" machen wollte, könnten Sie es wie folgt verpacken:

$.wait = function( callback, seconds){
   return window.setTimeout( callback, seconds * 1000 );
}

Sie könnten sie dann so aufrufen:

$.wait( function(){ $("#message").slideUp() }, 5);

Answer 3

Ich stieß auf diese Frage und dachte, ich würde ein Update zu diesem Thema bereitstellen. jQuery (v1.5+) enthält eine Deferred Modell, das (obwohl er sich nicht an die Versprechen/A Spezifikation bis jQuery 3) wird im Allgemeinen als klarerer Weg angesehen, um viele asynchrone Probleme anzugehen. Die Implementierung einer $.wait() Methode mit diesem Ansatz ist meiner Meinung nach besonders gut lesbar:

$.wait = function(ms) {
    var defer = $.Deferred();
    setTimeout(function() { defer.resolve(); }, ms);
    return defer;
};

Und hier ist, wie Sie es verwenden können:

$.wait(5000).then(disco);

Wenn Sie jedoch nach dem Anhalten nur Aktionen für eine einzelne jQuery-Auswahl durchführen möchten, dann müssen Sie debe die native jQuery-Funktion verwenden .delay() die, wie ich glaube, auch Deferred's unter der Haube verwendet:

$(".my-element").delay(5000).fadeIn();

Answer 4

setTimeout(function(){

},5000); 

Platzieren Sie Ihren Code innerhalb der { }

300 = 0.3 seconds

700 = 0.7 seconds

1000 = 1 second

2000= 2 seconds

2200 = 2.2 seconds

3500 = 3.5 seconds

10000 = 10 seconds

usw.

Answer 5

Ich verwende dieses für ein Nachrichten-Overlay, das sofort bei Klick geschlossen werden kann oder nach 10 Sekunden automatisch geschlossen wird.

button = $('.status-button a', whatever);
if(button.hasClass('close')) {
  button.delay(10000).queue(function() {
    $(this).click().dequeue();
  });
}