Как ждать 5 секунд с jQuery?

Встроенный javascript < a href = "http://www.w3schools.com/js/js_timing.asp" > setTimeout < / a >.

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

• ОБНОВЛЕНИЕ *: вы хотите подождать, так как, когда страница закончила загрузку, поэтому поместите этот код в свой $ (документ) .ready (...);Сценарий.

• ОБНОВЛЕНИЕ 2 *: jquery 1.4.0 ввел метод .delay. < a href = "http://api.jquery.com/delay/">Check it < / a >. Обратите внимание, что .delay работает только с очередями эффектов jQuery.

Используйте обычный таймер JavaScript:

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

Это будет ждать 5 секунд после того, как DOM будет готов. Если вы хотите подождать, пока страница действительно не будет «загружена», вам нужно использовать это:

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

EDIT: В ответ на комментарий OP, спрашивающий, есть ли способ сделать это в jQuery и не использовать setTimeout, ответ - нет. Но если бы вы хотели сделать его более «jQueryish», вы могли бы обернуть его так:

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

Вы могли бы тогда назвать это так:

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

Я столкнулся с этим вопросом и подумал, что предоставлю обновленную информацию по этой теме. jQuery (v1.5+) включает модель Deferred, которая * (несмотря на то, что не придерживается [Обещания / A](http:// Promises-aplus.github.io/promises-spec/) до jQuronous. Внедрение метода $ .wait () с использованием этого подхода особенно читаемо, я считаю:

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

И вот как вы можете использовать это:

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

Однако, если после паузы вы хотите выполнять действия только для одного выбора jQuery, то вы должны использовать родной jQuery .delay (), который Я считаю, также использует Отложенные под капотом:

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

setTimeout(function(){

},5000); 

Поместите свой код внутрь {{{}}}

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

и т.д.

Использовали это для наложения сообщения, которое можно закрыть сразу по щелчку или сделать автозагрузку через 10 секунд.

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

Underscore library также предоставляет функцию «задержки»:

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

Основываясь на ответе Джои, я придумал предполагаемое (по jQuery, прочитайте о «очередь») решение.

Он несколько следует синтаксису jQuery.animate () - позволяет связывать его с другими функциями fx, поддерживает «медленный» и другие jQuery.fx.speeds, а также полностью jQuery. И будет обрабатываться так же, как анимация, если вы остановите их.

Тестовый центр jsFiddle с большим количеством употреблений (например, демонстрация .stop ()), можно найти [здесь][1].

ядро решения: & Лт;!- начать фрагмент: js hide: ложная консоль: истинная павиана: false - >

& Лт;!- язык: lang-js - > $ ('< очередь / >') .delay (100 / мс /) .queue ((следующий) = > {$ ('# result') .text ('сделано.«); следующий(); } ;

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

& Лт;!- конец фрагмента - >

целое как плагин, поддерживающий использование $ .wait () и $ (..) .wait ():

& Лт;!- начать фрагмент: js hide: ложная консоль: истинная павиана: false - >

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

  $.wait = function(duration, completeCallback, target) {
    $target = $(target || '');
    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>

& Лт;!- конец фрагмента - >

Примечание: , поскольку ожидание добавляет в стек анимации, $ .css () выполняется немедленно - как и предполагалось: ожидаемое поведение jQuery.