Comment attendre 5 secondes avec jQuery?

Utilisez une minuterie javascript normale:

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

Cela attendra 5 secondes après que le DOM soit prêt. Si vous voulez attendre que la page soit réellement loaded, vous devez utiliser ceci:

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

EDIT: en réponse au commentaire de L'OP demandant s'il existe un moyen de le faire dans jQuery et de ne pas utiliser setTimeout la réponse est non. Mais si vous vouliez le rendre plus "jQueryish", vous pourriez l'envelopper comme ceci:

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

Vous pouvez alors l'appeler comme ceci:

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

J'ai rencontré cette question et j'ai pensé que je fournirais une mise à jour sur ce sujet. jQuery (v1. 5+) comprend un Deferred modèle, qui (bien que n'adhérant pas à la spécification Promises/a jusqu'à jQuery 3) est généralement considéré comme un moyen plus clair d'aborder de nombreux problèmes asynchrones. La mise en œuvre d'une méthode $.wait() utilisant cette approche est particulièrement lisible je crois:

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

Et voici comment vous pouvez l'utiliser:

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

Toutefois, si, après une pause, vous souhaitez effectuer des actions sur une seule sélection jQuery, alors vous devriez utiliser le natif de jQuery.delay() ce qui, je crois, utilise aussi les différés sous le capot:

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

setTimeout(function(){


},5000); 

Placez votre code à l'intérieur du { }

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

Etc.

Ont utilisé celui-ci pour une superposition de message qui peut être fermée immédiatement sur le clic ou il fait un autoclose après 10 Secondes.

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

La bibliothèque de soulignement fournit également une fonction "delay":

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

Sur la base de la réponse de Joey, je suis venu avec une solution prévue (par jQuery, lire à propos de 'queue').

Il suit quelque peu le jQuery.animate () syntaxe-permet d'être enchaîné avec d'autres fonctions fx, prend en charge 'lent' et d'autres jQuery.fx.les vitesses entièrement jQuery. Et sera géré de la même manière que les animations, si vous les arrêtez.

Jsfiddle test ground avec plus d'usages (comme montrer .stop()), peut être trouvé ici.

Le cœur de La solution est:

$('<queue/>')
.delay(100 /*ms*/)
.queue( (next) => { $('#result').text('done.'); next(); } );

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="result"></div>

Le tout comme un plugin, supportant l'utilisation de $.wait() et $(..).attends() :

// add wait as $.wait() standalone and $(elem).wait() for animation chaining
(function($) {

  $.wait = function(duration, completeCallback, target) {
    $target = $(target || '<queue />');
    return $target.delay(duration).queue(function(next){completeCallback && completeCallback.call($target); next();});
  }

  $.fn.wait = function(duration, completeCallback) {
    return $.wait.call(this, duration, completeCallback, this);
  };

})(jQuery);

//TEST
$(function() {

  // stand alone
  $.wait(1000, function() {
    $('#result')
    .append('...done');
  });

  // chained
  $('#result')
  .append('go...')
  .wait('slow', function() {
    $(this).append('after slow');
  })
  .css({color: 'green'});
  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="result"></div>

Note: {[14] } puisque wait ajoute à la pile d'animation,$.css () est exécuté immédiatement-comme il est supposé: comportement jQuery attendu.

$( "#foo" ).slideUp( 300 ).delay( 5000 ).fadeIn( 400 );