Forum Clubic

Pause en javascript - probleme avec setTimeout

Bonjour,

Je vous explique simplement ce que je voudrai faire. J’ai un tableau avec des cases (<td id=“1”>). Chaque case a son id. Mon but est de colorer les cases toutes les 2 secondes les unes apres les autres.

Voilà mon code :

for (i=1; i <= 5; i++) { // 5 cases a colorer en bleu
  setTimeout("document.getElementById(i).style.backgroundColor='blue'",2000);
}

Avec ce code la valeur de i passe de 1 à 5 directement.
J’ai alors essayer avec une fonction :

function colorier (x) {
             document.getElementById(x).style.backgroundColor='blue';
}
for (i=1; i <= 5; i++) { // 5 cases a colorer en bleu
  setTimeout("colorier("+i+")",2000);
}

Pareil ca ne fonctionne pas. Il me dit que la fonction attend un objet.

Comment resoudre mon problème Merci d’avance pour votre aide.

Bonjour,
je ne suis pas sûr que l’on puisse passer un argument aux fonctions par setTimeOut.
La solution c’est d’incrémenter “i” (ou x ) dans ta fonction colorier (en prenant le 2ème exemple et en suprriment l"arguments de la fonction colorier).
i doit être une variable globale pour ça :wink: (pas le choix :confused: )

edit: Il y a pas mal d’exemple de setTimeOut avec les barres de progression java script:
http://developpeur.journaldunet.com/tutori…ogression.shtml

Tes setTimeout sont appelés les uns à la suite des autres, en gros ton code correspond à :

Dans 2 secondes, exécute avec l’argument 1
Dans 2 secondes, exécute avec l’argument 2
Dans 2 secondes, exécute avec l’argument 3
Dans 2 secondes, exécute avec l’argument 4
Dans 2 secondes, exécute avec l’argument 5

Donc au bout de 2 secondes… Les 5 appels sont exécutés

Solution : appeler le setTimeout dans ta méthode (Deltree -> Il n’y a pas de problème pour passer un argument)

function colorier (x) {
             document.getElementById(x).style.backgroundColor='blue';
             if (x < 5) {
                       var appelSuivant = 'colorier(' + (x + 1) +')';
                       setTimeout(appelSuivant, 2000);
             }
}

setTimeout("colorier(1)",2000);