jQuery: espera / demora 1 segundo sem executar código

129

Não consigo obter o .delaymétodo funcionando no jQuery:

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

Estou usando um loop while para esperar até que um valor alterado descontrolado seja maior ou igual a outro e não consigo encontrar nenhuma maneira de interromper a execução por X segundos.

— Brian Graham
fonte

tente usar setTimeout no retorno de chamada

— theshadowmonkey 17/01

qual versão do jquery você está usando?

— L7ColWinters

1

não é para isso que a função delay é projetada, ela é projetada para uso entre eventos jquery na fila (como fade (). delay (). show ()). Você precisa da função setTimeOut.

— JoJa

@ JoJa: Você está correto no ponto principal, no entanto, a forma sem argumentos de mostrar (e ocultar) não usa a fila de efeitos.

— Jay Tomten

3

Por favor, indique o que você está tentando alcançar com o atraso. Todo o JavaScript é executado em um único encadeamento e o congelamento por X segundos pode causar uma experiência adversa ao usuário.

— Dmitry Shkuropatsky

176

$ .delay é usado para atrasar animações em uma fila, não para interromper a execução.

Em vez de usar um loop while, você precisa chamar recursivamente um método que executa a verificação a cada segundo usando setTimeout:

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

check();

— Justin Niessner
fonte

1

Eu acho que setTimeout é suficiente.

— Jiemurat 28/10/2013

3

Você é o cara da bomba, é exatamente isso que eu precisava para consertar meu código.

— jemiloii

@Jiemurat e qualquer outra pessoa no futuro: setTimeout não interrompe o fluxo de execução. O grande código de Niessner obtém isso até que as condições se tornem verdadeiras!

— Gabrer

Se você não precisar interromper o fluxo de execução, pode simplesmente usar setTimeout().

— Joshua Pinter

i sempre obter "cheque não é uma função", a minha função de verificação tem dois parâmetros que

— Preto

211

Você também pode atrasar algumas operações desta maneira:

setTimeout(function (){

  // Something you want delayed.

}, 5000); // How long do you want the delay to be (in milliseconds)?

— Matt Sich
fonte

7

Apenas um FYI, isso não interrompe o fluxo de execução; portanto, se você precisar "parar tudo" por alguns segundos, precisará de algo parecido com o que Niessner postou.

— Joshua Pinter

Sim ... é um retorno de chamada para a função e não bloqueia. Obrigado pela resposta, o problema foi corrigido.

— Bertus Kruger

se a frequência for extremamente curta e esperamos que essa função funcione para sempre, isso acabará com a pilha?

— Bunny suicídio

16

ES6 setTimeout

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

Edit: 204586560000 ms é o tempo aproximado entre a pergunta original e esta resposta ... assumindo que calculei corretamente.

— thedanotto
fonte

2

muito bom usando o tempo aproximado da questão original para esta resposta

— Fuzzybear

9

A delayfunção do jQuery deve ser usada com efeitos e filas de efeitos; consulte os delaydocumentos e o exemplo:

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

Se você quiser observar uma variável para alterações, poderá fazer algo como

(function() {
    var observerInterval = setInterval(function() {
        if (/* check for changes here */) {
           clearInterval(observerInterval);
           // do something here
        }
    }, 1000);
})();

— Julian D.
fonte

setInterval tem um segundo parâmetro obrigatório, o tempo em milissegundos;)

— sara_thepot

1

Obrigado @ sara.potyscki, corrigido.

— Julian D.

@JulianD. Obrigado por esta sugestão. Cheguei a essa pergunta enquanto pesquisava em busca de uma solução. Isso é exatamente o que eu precisava para o meu projeto.

— Cheryl Velez

8

JavaScript setTimeouté uma solução muito boa:

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

funcx();

A delayfunção no jQuery é usada principalmente para atrasar animações em uma fila de animação do jQuery.

— Jay Tomten
fonte

5

delay()não interrompe o fluxo do código e o executa novamente. Não há maneira prática de fazer isso em JavaScript. Tudo precisa ser feito com funções que recebam retornos de chamada, como os setTimeoutque outros mencionaram.

O objetivo do jQuery delay()é fazer com que uma fila de animação aguarde antes de executar. Assim, por exemplo $(element).delay(3000).fadeIn(250);, o elemento desaparecerá após 3 segundos.

— Nathan MacInnes
fonte

5

Somente javascript Funcionará sem 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>

— Faruk Omar
fonte

1

Fazer loop em javascript é uma má ideia! Toda a funcionalidade do javascript será interrompida enquanto o loop estiver em execução. Isso terá efeitos colaterais imprevistos. É muito melhor usar funções sem bloqueio, como setTimeout ().

— Kevin G.

4

Javascript é uma linguagem de programação assíncrona, portanto você não pode parar a execução por um tempo; a única maneira de [pseudo] parar uma execução é usar setTimeout () que não é um atraso, mas um "retorno de chamada de função atrasada".

— Fabio Buda
fonte

2

Se você estiver usando os recursos do ES6 e estiver em uma função assíncrona, poderá interromper efetivamente a execução do código por um certo tempo com esta função:

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

É assim que você o usa:

await delay(5000);

Ele será interrompido pela quantidade solicitada de milissegundos, mas apenas se você estiver em uma função assíncrona . Exemplo abaixo:

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

  await delay(5000);

  // some more code, executed 5 seconds after the first code block finishes
}

— Anthony De Smet
fonte