Actualisation de la page

Salut à tous!
Je fais un jeu en JavaScript où les images doivent souvent être remplacés par d'autres. J'ai un problème à ce niveau:

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21

function show() { clicks++; this.src = this.hidde.src; if(clicks % 2 == 0) { alert("to"); if(last.src != this.src) { pause(500); last.src = "image/default.jpg"; this.src = "image/default.jpg"; } else { this.onclick = function (){ return false; } } }

---

En gros l'image (this) doit être remplacée par une autre (hidde.src) mais le problème c'est que ce remplacement ne se fait qu'une fois sur deux, seulement quand le if qui suit n'est pas exécuté.
Par contre quand je fais le "alert", elle est bien modifiée. C'est comme si la page n'était pas actualisée à temps.
Quelqu'un a t-il une solution? Merci d'avance.

Bonsoir,
il manquerait 2 infos
- comment est appelée la fonction show (la function show bien sûr, j'ai honte!!! ).
- qu'y a t-il dans la fonction pause.

Il semblerait qu'il y ait du setInterval ou setTimeout dans l'air.

Alors la fonction show() est appelée à chaque fois qu'on clique sur une image :

Code:

---

1 2	allCell[i].onclick=show; //avec i qui parcourt le tableau allCell

---

La fonction pause() contient un boucle (assez bancale, je le reconnais) qui permet de mettre le programme en pause. Le but est d'afficher l'image pendant quelques secondes.

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13

function pause(duree) {   var date_debut = new Date(); var actdate = new Date();   while (actdate.getTime() - date_debut.getTime() <= duree) { actdate = new Date(); }   }

---

Du coup je ne pense que setInterval ou setTimeout feraient l'affaire vu que la fonction ne doit pas être répétée à un intervalle régulier, mais après un clic sur une image.

j'ai un peu de mal à comprendre la finalité de la chose et notamment le if(clicks % 2 == 0).

Lors d'un nombre de clic pair, tu réaffectes la src de ton IMG avec this.src="image/default.jpg";, alors que juste avant tu lui as affecté this.hidde.src.

Oui mais il y a un autre if juste après:

Code:

---

1 2	if(last.src != this.src)

---

Pas de chagement si la condition n'est pas vérifiée, sinon on affiche une image pendant une demi-seconde avant de la changer.

ton deuxième if est imbriqué dans le premier if(clicks % 2 == 0), donc tu ne feras ce test qu'un fois sur deux.

Oui c'est normal. Je dois tester seulement s'il clique deux fois vu que je dois comparer les deux images cliquées.

Citation:

---

...Je dois tester seulement s'il clique deux fois vu que je dois comparer les deux images cliquées.

---

le soleil se lève ;)

il faut donc que tu supprimes ta fonction pause pour la remplacer par un appel à une fonction déportée que tu exécuteras après un certains, c'est typiquement setTimeout.

Effectivement, pour faire simple, le moteur de rendu n'est pas prioritaire sur le script et celui ci mais à jour ce qui doit l'être quand on lui en laisse l'opportunité.

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13

if (last.src != this.src) { // pause(500); SUPPRIME var oImg = this; // stoque l'image cliquée car problème de scope setTimeout( function(){ last.src = "image/default.jpg"; oImg.src = "image/default.jpg"; }, 1000); } else { this.onclick = function () { return false; } }

---

on passe par une fonction anonyme et on appelle à l'intérieur de celle ci non pas this, qui ne correspondra plus au this de la fonction show au moment de son exécution, mais à oImg qui as servi à mémoriser ce fameux this.

J'ai finalement résolu le problème en divisant ma fonction en deux: une qui affiche et une autre qui fait la comparaison des images. Mais je tiens quand même à comprendre ce qui n'allait pas.
-D'abord dans le code que j'ai posté j'ai constaté que les changements d'images tout comme les autres modifications du HTML ne prennent effet qu'à la fin de la fonction qui les fait (d'où l'idée de faire une deuxième fonction). C'est toujours le cas?
-Dans ton code, en utilsant setTimeout la fonction anonyme sera rappelée chaque seconde n'est-ce pas? Si oui ça n'aurait pas été très pratique. De plus il y avait des instructions après le else. Est-ce qu'elles seraient exécutées?

Citation:

---

-D'abord dans le code que j'ai posté j'ai constaté que les changements d'images tout comme les autres modifications du HTML ne prennent effet qu'à la fin de la fonction qui les fait (d'où l'idée de faire une deuxième fonction). C'est toujours le cas?

---

comme indiqué plus haut

Citation:

---

Envoyé par NoSmoking

...pour faire simple, le moteur de rendu n'est pas prioritaire sur le script et celui ci mais à jour ce qui doit l'être quand on lui en laisse l'opportunité.

---

Citation:

---

-Dans ton code, en utilsant setTimeout la fonction anonyme sera rappelée chaque seconde n'est-ce pas?

---

NON une seule fois et au bout d'un délai, approximatif de 1s, contrairement à setInterval que l'on appelle une fois et qui se répète à délai intervalle.

Citation:

---

De plus il y avait des instructions après le else. Est-ce qu'elles seraient exécutées?

---

OUI et avant la fonction anonyme mise dans le setTimeout.

Il te suffit d'essayer pour te rendre compte!

Merci le problème est réglé alors!