Comportement étrange de setTimeout(), il "mémorise" les évènements [Résolu]

Signaler
Messages postés
344
Date d'inscription
jeudi 1 mai 2003
Statut
Membre
Dernière intervention
4 avril 2011
-
Messages postés
344
Date d'inscription
jeudi 1 mai 2003
Statut
Membre
Dernière intervention
4 avril 2011
-
Bonjour à tous,

J'ai une appli Web qui permet de faire défiler des contenus ("Steps") de la manière d'un diaporama.
Il y a 2 modes de défilement des steps: Auto (un temps est défini pour chaque step) et manuel (clic sur un bouton).

Voici le problème (l'incohérence n'apparait que sous IE):
L'appli démarre en mode auto, les temps d'affichage des steps sont bien respectés.
Passons au mode manuel et naviguons... Lorsqu'on revient au mode procédure, les steps s'enchaînent à la même vitesse que celle à laquelle on les a fait défiler dans le mode manuel. Le setTimeout() est complètement perturbé.
J'ai essayé des clearTimeOut() à gogo, mais rien n'y fait.

J'ai isolé le cas de figure dans un exemple simple et autonome:
<html><head><title>TEST</title>
<script type="text/javascript">
var tab = new Array(5, 1, 3, 5, 1, 5, 5, 5, 5, 5, 5, 5, 5); // Tableau du temps d'affichage de chaque Step
var idx = 0; // Index du step en cours
var modeDefilAuto = true; // Mode de défilement actuel (auto/manuel)

function afficheStep() { // Affiche le step de l'idx en cours
document.getElementById("divMain").innerHTML = "Etape: "+idx+" ("+tab[idx]+" sec)
Défilement Auto: "+modeDefilAuto
+".<script language='javascript'>setTimeout('faireNext();', "+(tab[idx] * 1000)+");<\/script>";
for (var i=0; i<document.getElementById("divMain").getElementsByTagName("script").length; i++) { // Boucle pour que le javascript injecté soit interpreté
eval(document.getElementById("divMain").getElementsByTagName("script")[i].innerHTML);
        }
}

function changeMode() { // Passe du mode auto au mode manuel et inversement
modeDefilAuto = ! modeDefilAuto;
idx = 0;
afficheStep();
}

function nextStep() { // Passe au step suivant
if (idx<12) {
idx++;
afficheStep();
}
}

function faireNext() {
if (modeDefilAuto) {
nextStep(); 
}
}
</script>
</head>
<center>



Principal




</center>
</html>

Pouvez vous me donner une explication ?

Merci d'avance.

4 réponses

Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
17
Bonjour,
il serait souhaitable que tu killes le timer, avec clearTimeout, avant de rappeler la fonction setTimeout.
PS : drôle de façon d'activer le javascript !!!

;O)
Messages postés
344
Date d'inscription
jeudi 1 mai 2003
Statut
Membre
Dernière intervention
4 avril 2011
1
Bonjour PetoleTeam,

Impec, c'était ça... Je le faisait, mais pas ou il fallait.

Oui, pour la façon d'activer le JS, j'ai chopé ça sur la toile... Ça fonctionne pas mal.

Merci.
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
17
Bonjour,
le principal est que cela marche même si ta façon de procéder me laisse un peu pantois...

;O)
Messages postés
344
Date d'inscription
jeudi 1 mai 2003
Statut
Membre
Dernière intervention
4 avril 2011
1
En effet... Mais c'est fait exprès.

En fait, mon appli est en jQuery+PHP.
En ajax, je met le code javascript dans le DIV depuis un script PHP pour ne pas avoir à rafraichir la page.
J'ai voulu reproduire le cas en Javascript pur le plus fidèlement possible pour bien identifier le problème, voir si ça ne venait pas d'autre chose.

Voilà, pour ne pas vous laisser pantois.