Boucle for Et AddEventListener

Bonjour a toutes et a tous,

Voila mon problème :
Je suis en train de crée une interface de VOD. Quand on passe sur une jaquette le nom du film s'affiche en bas de l'écran.
J'ai donc attaché 2 événement :
- Le premier avec lequel j'ai aucun souci (click) l'id du film qui est aussi l'id de l'img est transmit a la fonction descriptionFilm
- Le deuxième avec lequel je bute depuis trop longtemps... (focus)
Le problème de cette événement réside dans la boucle for, car le titre associé au 'n' film sera le dernier titre de ma boucle!


Le Code élagué:

Code:

---

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

var me = this; nbFilm = me.xhr.responseXML.documentElement.childNodes.length; film = me.xhr.responseXML.documentElement.getElementsByTagName("film"); for (var i=0;i<nbFilm;i++){ id = film[i].getElementsByTagName("vod_id")[0].firstChild.nodeValue; titre = film[i].getElementsByTagName("vod_titre")[0].firstChild.nodeValue; image =film[i].getElementsByTagName("vod_image")[0].firstChild.nodeValue;   img = document.createElement("img"); img.setAttribute("id",id); img.setAttribute("src","../../../common/img_vod/"+image); img.addEventListener("click",function{me.descriptionFilm(id)},false); img.addEventListener("blur",function{document.getElementById("menuTitre").innerHTML ="";},false); img.addEventListener("focus",function{document.getElementById('menuTitre').innerHTML = '<h2>'+titre+'</h2>';},false);   document.getElementById("menuMosaique").appendChild(appendChild(img)); }

---

Merci d'avance

Salut,

Ça t'aidera peut-être : http://www.developpez.net/forums/d66...-bouton-radio/

Merci pour ta réponse rapide. Mais je ne voix aucune similarité entre nos deux problème. Je développe le javascript aussi en class avec un prototypage du style :

Code:

---

1 2 3 4

function Menu(){ } Menu.prototype.mosaique = function(){ }

---

Mais mon seul problème n'est pas le contexte de mes fonction mais celui de la boucle for!! Comme si il mettait de coté les addEventListener et qu'il les fraient a la fin de la boucle. Ce qui ce traduirai par attaché les evenements avec la même variable titre qui serai la dernière de la boucle. Je sais pas si ce raisonnement est correct. Alors je vais essayé de récupéré la variable dans un tableau. Ce qui me permettra de conservé toute les valeur de la boucle.

J'ai vue que s'était possible de le faire a partir du DOM 0 avec innerHTML
EXE

Code:

---

1 2 3 4 5 6 7 8

jaquette.innerHTML="<img onFocus=\" document.getElementById('film').innerHTML = '<img src="+image+" >'; document.getElementById('titre').innerHTML = '<h2>"+titre+"</h2>';\" onBlur=\" document.getElementById('titre').innerHTML = "";\" src='"+image+"' />";

---

Mais étant sur un système embarqué j'aurai aimé passé par des fonctions du DOM 2 (pour suivre les recommandations du browser ANT software)

Merci pour toute réponse pertinente
Cordialement

Peut-être une explication dans la FAQ ?
Ceci dit, cela aussi me laisse perplexe :

Citation:

---

l'id du film qui est aussi l'id de l'img

---

est-ce à dire que plusieurs éléments ont le même id ???

Yeah merci bovino :). Et Effectivement ma réponse était bien dans les FAQ :oops: désolé j'ai vraiment pas l'habitude des forums.

Alors pour synthétise :

l'id du film qui est aussi l'id de l'img => l'id du film dans ma base de donnée est le même que l'id de l'élément img en HTML ce qui me permet de gardé le lien du film (désole je m'était un peu mal exprimer).

L'événement focus fonctionné car l'id fessai référence a l'id de l'élément au qu'elle on attache l'event (img).
Donc il faut enregistrer les variables dans les propriétés de l'élément pour pouvoir y faire référence dans l'événement focus :

Code:

---

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

var me = this; nbFilm = me.xhr.responseXML.documentElement.childNodes.length; film = me.xhr.responseXML.documentElement.getElementsByTagName("film"); for (var i=0;i<nbFilm;i++){ img = document.createElement("img"); img.id = film[i].getElementsByTagName("vod_id")[0].firstChild.nodeValue; img.titre = film[i].getElementsByTagName("vod_titre")[0].firstChild.nodeValue; img.image =film[i].getElementsByTagName("vod_image")[0].firstChild.nodeValue;     img.setAttribute("id",img.id); img.setAttribute("src","../../../common/img_vod/"+img.image); img.addEventListener("click",function{me.descriptionFilm(this.id)},false); img.addEventListener("blur",function{document.getElementById("menuTitre").innerHTML ="";},false); img.addEventListener("focus",function{document.getElementById('menuTitre').innerHTML = '<h2>'+this.titre+'</h2>';},false);   document.getElementById("menuMosaique").appendChild(appendChild(img)); }

---