Jak odczekać 5 sekund za pomocą jQuery?

Próbuję stworzyć efekt, w którym strona ładuje się, a po 5 sekundach komunikat o sukcesie na ekranie zanika, lub przesuwa się w górę.

Jak mogę to osiągnąć?

Rozwiązanie

Wbudowany w javascript setTimeout.

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

UPDATE: chcesz czekać od momentu, gdy strona skończy się ładować, więc umieść ten kod wewnątrz swojego skryptu $(document).ready(...);.

UPDATE 2: jquery 1.4.0 wprowadziło metodę .delay. Check it out. Zwróć uwagę, że .delay działa tylko z kolejkami efektów jQuery.

Komentarze (10)

Użyj zwykłego timera javascript:

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

To będzie czekać 5 sekund po tym jak DOM jest gotowy. Jeśli chcesz poczekać, aż strona zostanie faktycznie załadowana, musisz użyć tego:

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

EDIT: W odpowiedzi na komentarz OP's pytającego, czy jest sposób, aby zrobić to w jQuery i nie używać setTimeout, odpowiedź brzmi nie. Ale jeśli chciałbyś, aby było to bardziej "jQueryish", mógłbyś zawinąć to w ten sposób:

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

Następnie mógłbyś wywołać go w ten sposób:

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

Biblioteka Underscore udostępnia również funkcję "delay":

_.delay(function(msg) { console.log(msg); }, 5000, 'Hello');
Komentarze (0)