Enjambres
Estoy trabajando en un sitio web, donde necesito crear una pausa o un retraso.
Por favor, dígame cómo crear una pausa o un retraso en for incluyete javascript o jQuery
Este es un ejemplo de prueba
var s = document.getElementById("div1");
for (i = 0; i < 10; i++) {
s.innerHTML = s.innerHTML + i.toString();
//create a pause of 2 seconds.
}
Guffa
No puede usar un retraso en la función, porque entonces el cambio que le hace al elemento no se mostrará hasta que salga de la función.
Utilizar el setTimeout para ejecutar piezas de código en un momento posterior:
var s = document.getElementById("div1");
for (i = 0; i < 10; i++) {
// create a closure to preserve the value of "i"
(function(i){
window.setTimeout(function(){
s.innerHTML = s.innerHTML + i.toString();
}, i * 2000);
}(i));
}
-
@Pointy: Buen punto. Agregué un cierre para preservar cada valor.
– Guffa
7 abr 2012 a las 22:11
-
@Guffa: Sus corchetes están apagados en la ejecución de su función
– Vidrio roto
7 abr 2012 a las 23:55
-
@BrokenGlass: No, no lo son. El código funciona bien. jsfiddle.net/Guffa/PcuxY
– Guffa
8 de abril de 2012 a las 8:27
-
Estoy un poco confundido, si el cierre “conserva el valor de
i“¿Por qué no es lo que se calcula pori * 2000igual a0como0es el primer valor dei? O siise incrementa en cada iteración, ¿por qué la duración entre cada iteracióninnerHTMLactualización no aumentó de la misma manera?– 1252748
23 de noviembre de 2016 a las 6:03
-
es aún más confuso cuando inicio sesión en la primera línea del ciclo y la primera línea de la vida: ambos registran `0-9` inmediatamente. Sé que ha pasado mucho tiempo, pero ¿puedes explicar un poco qué está pasando aquí? jsbin.com/foqineciva/edit?html,js,salida
– 1252748
23 de noviembre de 2016 a las 6:15
nicosantangelo
var wonderfulFunction = function(i) {
var s = document.getElementById("div1"); //you could pass this element as a parameter as well
i = i || 0;
if(i < 10) {
s.innerHTML = s.innerHTML + i.toString();
i++;
//create a pause of 2 seconds.
setTimeout(function() { wonderfulFunction(i) }, 2000);
}
}
//first call
wonderfulFunction(); //or wonderfulFunction(0);
No puede pausar el código javascript, todo el lenguaje está hecho para funcionar con eventos, la solución que proporcioné le permite ejecutar la función con cierto retraso, pero la ejecución nunca se detiene.
-
Esto tendrá un gran problema porque todas las funciones de tiempo de espera comparten el mismo valor de “i”. Todos pasarán 11 a “funciónmaravillosa”.
– Puntiagudo
7 abr 2012 a las 22:10
-
¿Cuál es el
forbucle para? Dado que siempre ejecuta elbreak¿No sería más sencillo usar unif¿declaración? Por la misma razón, no veo por qué necesitas la función interna…– nnnnnn
7 abr 2012 a las 22:34
-
@nnnnnn Porque edité la respuesta sin pensar. Tomé un enfoque diferente al principio y luego lo cambié para usar el cierre. El camino está escrito el
fores inútil, tiempo de edición :).– nicosantangelo
7 abr 2012 a las 22:39
-
Lo siento, mi sintaxis JS no es la mejor. que dice la linea
i = i || 0;¿significar?– Víctor Resnov
28 de noviembre de 2019 a las 15:07
-
@VictorResnov significa “asignar
ia sí mismo si el valor deies veraz, de lo contrario asígnalo a 0″ developer.mozilla.org/en-US/docs/Glossary/Truthy– nicosantangelo
5 de marzo de 2020 a las 15:26
Probé todos, pero creo que este código es mejor, es un código muy simple.
var s = document.getElementById("div1");
var i = 0;
setInterval(function () {s.innerHTML = s.innerHTML + i.toString(); i++;}, 2000);
SKing7
si desea crear una pausa o un retraso en el bucle FOR, el único método real es
while (true) {
if( new Date()-startTime >= 2000) {
break;
}
}
el tiempo de inicio es el tiempo antes de ejecutar el tiempo, pero este método hará que los navegadores se vuelvan muy lentos
Es imposible pausar directamente una función Javascript dentro de un for bucle y luego reanudar en ese punto.
estrellax
Así es como debes hacerlo
var i = 0;
setTimeout(function() {
s.innerHTML = s.innerHTML + i.toString();
i++;
},2000);
zatatatata
El siguiente código es un ejemplo de pseudo-multiproceso que puede hacer en JS, es más o menos un ejemplo de cómo puede retrasar cada iteración de un bucle:
var counter = 0;
// A single iteration of your loop
// log the current value of counter as an example
// then wait before doing the next iteration
function printCounter() {
console.log(counter);
counter++;
if (counter < 10)
setTimeout(printCounter, 1000);
}
// Start the loop
printCounter();
No puede “pausar” JavaScript en un navegador web. Sin embargo, puede configurar temporizadores y hacer que el código se ejecute en un momento posterior con el
setTimeout()ysetInterval()API disponibles en todos los navegadores.– Puntiagudo
7 abr 2012 a las 22:06
tldr: debe convertir el código en un estilo recursivo de paso de continuación si desea aprovechar la asincronía. (Bueno, eso o usar un truco inteligente como lo hizo Guffa)
– hugomg
8 de abril de 2012 a las 0:25
Similar a stackoverflow.com/questions/4548034/…
–Paul Verest
6 de marzo de 2014 a las 7:45
¿Responde esto a tu pregunta? ¿Cómo agrego un retraso en un bucle de JavaScript?
– Ivar
13 abr 2021 a las 9:30