setTimeout retard ne fonctionne pas
J'ai essayer d'envelopper ma tête autour de setTimeout
, mais je ne peux pas le faire fonctionner correctement.
J'ai mis en place un exemple ici: http://jsfiddle.net/timkl/Fca2n/
Je veux un texte du compte à rebours après une ancre est cliqué, mais mon setTimeout
semble le feu en même temps, même si j'ai mis le délai d'attente de 1 seconde.
C'est mon code HTML:
<a href="#">Click me!</a>
<span id="target"></span>
C'est mon JS:
$(document).ready(function() {
function foo(){
writeNumber = $("#target");
setTimeout(writeNumber.html("1"),1000);
setTimeout(writeNumber.html("2"),1000);
setTimeout(writeNumber.html("3"),1000);
};
$('a').click(function() {
foo();
});
});
Tout soupçon sur ce que j'ai pu faire de mal, c'est très apprécié 🙂
Vous devez vous connecter pour publier un commentaire.
setTimeout
prend une fonction en tant qu'argument. Vous êtes l'exécution de la fonction et le résultat le passage ensetTimeout
(si la fonction est exécutée tout de suite). Vous pouvez utiliser les fonctions anonymes, par exemple:Noter que le même est vrai de
setInterval
.setTimeout
etsetInterval
, mais pour tous les cas, vous êtes censé passer de rappel que l'un des paramètres.Vous avez besoin d'envelopper vos déclarations dans les fonctions anonymes et aussi d'échelonner vos timings -
Si vous définissez tout à
1000
les étapes assez bien fonctionner simultanément comme lesetTimeout
fonction exécute la tâche 1 seconde après que vous avez appelé la fonction pas 1 seconde après l'appel précédent de lasetTimeout
fonction de fini.Démo - http://jsfiddle.net/JSe3H/1/
Vous devez utiliser une fonction référence être invoquée plus tard lors de l'expiration de la minuterie. Envelopper chaque instruction dans une fonction anonyme, de sorte qu'il n'est pas exécuté immédiatement, mais plutôt lors de l'expiration de la minuterie.
Aussi, vous souhaitez utiliser une autre valeur de retard pour chacun de sorte que les compteurs n'ont pas d'échéance en même temps. Voir une mise à jour de violon à http://jsfiddle.net/RqCqM/
Il y a une disposition pour passer des arguments à la fonction. Dans votre cas, vous pouvez le faire par
troisième argument à la fonction setTimeout sera de passer à writeNumber.html fonction
Suffit d'utiliser
setInterval()
. Ici's ce que j'ai trouvé. Voici votre nouveau javascript:Vous avez besoin tot utiliser une des fonctions à être appelée après le délai d'attente est passé; vous pouvez utiliser la fonction anonyme trop, alors votre fonction foo ressembler à ceci:
J'ai atterri sur cette question. Il a été répondu de manière adéquate, et je pense que l'utilisation
setInterval
comme @Purag suggéré est probablement la meilleure approche pour obtenir les comportement fonctionnel. Toutefois, le code initial exemple ne pas prendre de JavaScript asynchroneous comportement en compte. C'est une erreur survenant souvent, que j'ai fait moi-même sur plus d'occasion :).Donc comme une note de côté, je voulais donner une autre solution possible pour ce qui imite la première tentative, mais cette fois, NE tient pas compte du Javascript Asynchronousity:
Maintenant, bien sûr, c'est clairement terrible code!
J'ai donné un travail JSFiddle dans mon propre DONC, la question. Ce code illustre la soi-disant pyramide de doom. Et cet effet peut être atténué par l'utilisation de JavaScript promesses, comme indiqué dans les réponses à ma question. Il prend un peu de travail pour écrire une version de
WriteNumber()
qui utilise des Promesses, mais le code peut être réécrit pour somehting comme: