jQuery: attendere / ritardare 1 secondo senza eseguire il codice

129

Non riesco a far funzionare il .delaymetodo in jQuery:

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

Sto usando un ciclo while per attendere fino a quando un valore di modifica incontrollata è maggiore o uguale a un altro e non riesco a trovare alcun modo per eseguire l'esecuzione in modo anomalo per X secondi.

— Brian Graham
fonte

prova a utilizzare setTimeout nel callback

— thehdowmonkey

quale versione di jquery stai usando?

— L7ColInverno

1

non è per questo che è progettata la funzione delay, è progettata per l'uso tra eventi jquery in coda (come fade (). delay (). show ()). È necessaria la funzione setTimeOut.

— JoJa,

@JoJa: hai ragione sul punto principale, tuttavia la forma no topic di show (e hide) non usa la coda degli effetti.

— Jay Tomten,

3

Per favore, indica cosa stai cercando di ottenere con il ritardo. Tutto JavaScript viene eseguito su un singolo thread e il blocco per X secondi può causare un'esperienza utente avversa.

— Dmitry Shkuropatsky il

176

$ .delay è usato per ritardare le animazioni in una coda, non per fermare l'esecuzione.

Invece di usare un ciclo while, è necessario chiamare ricorsivamente un metodo che esegue il controllo ogni secondo 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

Penso che setTimeout sia abbastanza.

— Jiemurat,

3

Sei il fratello della bomba, questo è esattamente ciò di cui avevo bisogno per correggere il mio codice.

— jemiloii,

@Jiemurat e chiunque altro in futuro: setTimeout non interrompe il flusso di esecuzione. Il grande codice di Niessner ottiene questo fino a quando le condizioni si sono avverate!

— Gabrer,

Se non hai bisogno di interrompere il flusso di esecuzione, puoi semplicemente usare setTimeout().

— Joshua Pinter,

ottengo sempre "il controllo non è una funzione", tuttavia la mia funzione di controllo ha due parametri

— Black

210

Puoi anche solo ritardare alcune operazioni in questo modo:

setTimeout(function (){

  // Something you want delayed.

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

— Matt Sich
fonte

7

Solo un FYI, questo non interrompe il flusso di esecuzione, quindi se hai bisogno di "fermare tutto" per alcuni secondi, avrai bisogno di qualcosa di simile a quello che Niessner ha pubblicato.

— Joshua Pinter,

Sì ... è un richiamo alla funzione e non si blocca. Grazie per la risposta, ha risolto il mio problema.

— Bertus Kruger,

se la frequenza è estremamente breve e prevediamo che questa funzione sia attiva per sempre, riuscirà a far saltare lo stack?

— Suicide Bunny,

16

ES6 setTimeout

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

Modifica: 204586560000 ms è il tempo approssimativo tra la domanda originale e questa risposta ... supponendo che abbia calcolato correttamente.

— thedanotto
fonte

2

davvero bello usare il tempo approssimativo dalla domanda originale a questa risposta

— Fuzzybear,

9

La delayfunzione di jQuery è pensata per essere utilizzata con effetti e code di effetti, vedere i delaydocumenti e l'esempio in essi:

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

Se vuoi osservare una variabile per le modifiche, potresti fare qualcosa del genere

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

— Julian D.
fonte

setInterval ha un secondo parametro obbligatorio, il tempo in millisecondi;)

— sara_thepot

1

Grazie @ sara.potyscki, risolto.

— Julian D.

@JulianD. Grazie per questo suggerimento Sono arrivato a questa domanda mentre cercavo una soluzione su Google. Questo è esattamente ciò di cui avevo bisogno per il mio progetto.

— Cheryl Velez,

8

JavaScript setTimeoutè un'ottima soluzione:

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

funcx();

La delayfunzione in jQuery viene utilizzata principalmente per ritardare le animazioni in una coda di animazione jQuery.

— Jay Tomten
fonte

5

delay()non interrompe il flusso di codice, quindi lo esegue nuovamente. Non esiste un modo pratico per farlo in JavaScript. Tutto deve essere fatto con funzioni che accettano callback comesetTimeout menzionate da altri.

Lo scopo di jQuery delay()è di attendere una coda di animazione prima dell'esecuzione. Ad esempio $(element).delay(3000).fadeIn(250);, l'elemento si dissolverà dopo 3 secondi.

— Nathan MacInnes
fonte

5

Solo javascript Funzionerà senza 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

Ciclo di attesa in JavaScript è una cattiva idea! Tutta la funzionalità javascript si interromperà mentre il ciclo è in esecuzione. Ciò avrà effetti collaterali imprevisti. È molto meglio usare funzioni non bloccanti come setTimeout ().

— Kevin G.

4

Javascript è un linguaggio di programmazione asincrono, quindi non è possibile interrompere l'esecuzione per un certo periodo di tempo; l'unico modo in cui è possibile [pseudo] interrompere un'esecuzione è utilizzare setTimeout () che non è un ritardo ma una "richiamata di funzione ritardata".

— Fabio Buda
fonte

2

Se si utilizzano le funzionalità ES6 e ci si trova in una funzione asincrona, è possibile interrompere in modo efficace l'esecuzione del codice per un certo tempo con questa funzione:

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

Ecco come lo usi:

await delay(5000);

Si bloccherà per la quantità richiesta di millisecondi, ma solo se si è in una funzione asincrona . Esempio sotto:

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