jQuery: ожидание / задержка 1 секунду без выполнения кода

129

Я не могу заставить этот .delayметод работать в jQuery:

$.delay(3000); // not working
$(queue).delay(3000); // not working

Я использую цикл while, чтобы дождаться, пока неконтролируемое изменяющееся значение не станет больше или равным другому, и я не могу найти способ вызвать выполнение в течение X секунд.

javascript jquery delay wait seconds Брайан Грэм
источник
попробуйте использовать setTimeout в
обратном вызове
какую версию jquery вы используете?
L7ColWinters
1
это не то, для чего предназначена функция задержки, она предназначена для использования между событиями jquery в очереди (например, fade (). delay (). show ()). Вам нужна функция setTimeOut.
JoJa
@JoJa: Вы правы в главном, однако форма без аргументов show (и hide) не использует очередь эффектов.
Джей Томтен
3
Пожалуйста, укажите, чего вы пытаетесь достичь с задержкой. Весь JavaScript выполняется в одном потоке, и его замораживание на X секунд может вызвать неблагоприятные условия для пользователя.
Дмитрий Шкуропатский

Ответы:

176

$ .delay используется для задержки анимации в очереди, а не для остановки выполнения.

Вместо использования цикла while вам нужно рекурсивно вызвать метод, который выполняет проверку каждую секунду, используя setTimeout:

var check = function(){
    if(condition){
        // run when condition is met
    }
    else {
        setTimeout(check, 1000); // check again in a second
    }
}

check();
Джастин Нисснер
источник
1
Думаю, setTimeout достаточно.
Jiemurat
3
Ты бомба, братан, это именно то, что мне нужно, чтобы исправить мой код.
jemiloii
@Jiemurat и кто-либо еще в будущем: setTimeout не нарушает поток выполнения. Великий кодекс Нисснера получил это до тех пор, пока условия не стали реальностью!
Габрер 05
Если вам не нужно прерывать поток выполнения, вы можете просто использовать setTimeout().
Джошуа Пинтер
я всегда получаю «проверка не функция», хотя моя функция проверки имеет два параметра
Black
210

Вы также можете просто отложить некоторые операции следующим образом:

setTimeout(function (){

  // Something you want delayed.

}, 5000); // How long do you want the delay to be (in milliseconds)?
Мэтт Сич
источник
7
Просто к вашему сведению, это не нарушает поток выполнения, поэтому, если вам нужно «остановить все» на несколько секунд, вам понадобится что-то вроде того, что опубликовал Нисснер.
Джошуа Пинтер
Да ... это обратный вызов функции и не блокирует. Спасибо за ответ, моя проблема решена.
Бертус Крюгер
если частота очень мала и мы ожидаем, что эта функция будет работать вечно, не взорвет ли она стек?
Suicide Bunny
16

ES6 setTimeout

setTimeout(() => {
  console.log("we waited 204586560000 ms to run this code, oh boy wowwoowee!");
}, 204586560000);

Изменить: 204586560000 мс - приблизительное время между исходным вопросом и этим ответом ... при условии, что я правильно рассчитал.

thedanotto
источник
2
действительно приятно использовать приблизительное время от исходного вопроса до этого ответа
Fuzzybear
9

delayФункция jQuery предназначена для использования с эффектами и очередями эффектов, см. delayдокументацию и пример в ней:

$('#foo').slideUp(300).delay(800).fadeIn(400);

Если вы хотите наблюдать за изменениями переменной, вы можете сделать что-то вроде

(function() {
    var observerInterval = setInterval(function() {
        if (/* check for changes here */) {
           clearInterval(observerInterval);
           // do something here
        }
    }, 1000);
})();
Джулиан Д.
источник
У setInterval есть второй обязательный параметр, время в миллисекундах;)
sara_thepot
1
Спасибо @ sara.potyscki, исправлено.
Джулиан Д.
@JulianD. Спасибо за это предложение. Я столкнулся с этим вопросом, пока искал решение. Это именно то, что мне нужно для моего проекта.
Шерил Велес,
8

JavaScript setTimeout- очень хорошее решение:

function funcx()
   {
   // your code here
   // break out here if needed
   setTimeout(funcx, 3000);
   }

funcx();

delayФункция JQuery в основном используется для задержки анимации в очереди анимации JQuery.

Джей Томтен
источник
5

delay()не останавливает поток кода, а затем повторно запускает его. В JavaScript нет практического способа сделать это. Все должно быть сделано с помощью функций, которые принимают обратные вызовы, о setTimeoutкоторых упоминали другие.

Цель jQuery delay()- заставить очередь анимации ждать перед выполнением. Так, например $(element).delay(3000).fadeIn(250);, заставит элемент исчезнуть через 3 секунды.

Натан Макиннес
источник
5

Только javascript Работает без jQuery 

<!DOCTYPE html>
<html>
    <head>
        <script>
            function sleep(miliseconds) {
                var currentTime = new Date().getTime();
                while (currentTime + miliseconds >= new Date().getTime()) {
                }
            }

            function hello() {
                sleep(5000);
                alert('Hello');
            }
            function hi() {
                sleep(10000);
                alert('Hi');
            }
        </script>
    </head>
    <body>
        <a href="#" onclick="hello();">Say me hello after 5 seconds </a>
        <br>
        <a href="#" onclick="hi();">Say me hi after 10 seconds </a>


    </body>
</html>
Фарук Омар
источник
1
Циклическое ожидание в javascript - плохая идея! Все функции javascript будут остановлены во время выполнения цикла. Это будет иметь непредвиденные побочные эффекты. Намного лучше использовать неблокирующие функции, такие как setTimeout ().
Кевин Г.
4

Javascript - это асинхронный язык программирования, поэтому вы не можете остановить выполнение на какое-то время; единственный способ [псевдо] остановить выполнение - использовать setTimeout (), который не является задержкой, а является «отложенным обратным вызовом функции».

Фабио Буда
источник
2

Если вы используете функции ES6 и используете асинхронную функцию, вы можете эффективно остановить выполнение кода на определенное время с помощью этой функции:

const delay = millis => new Promise((resolve, reject) => {
  setTimeout(_ => resolve(), millis)
});

Вот как вы его используете:

await delay(5000);

Он остановится на запрошенное количество миллисекунд, но только если вы используете асинхронную функцию . Пример ниже:

const myFunction = async function() {
  // first code block ...

  await delay(5000);

  // some more code, executed 5 seconds after the first code block finishes
}
Энтони Де Смет
источник