onclick sur conteneur div

Question

Bonjour à tous,

Je rencontre un petit soucis et malgré toutes mes recherches je n'arrive pas a trouvé une solution... Je m'explique :

J'ai deux div imbriqués l'un dans l'autre :



   

      Texte
   





Puis j'ai mon code JS qui crée un event onclick sur chaque div dans la page :

function load_javascript()
{
   var div = document.getElementsByTagName("div");
   for (var i = 0; i < div.length; i++) { 
      var obj = div[i];
      var obj_id = obj.id;
      obj.onclick = function () { click(obj_id); return false};
   } 
}

function click(value) {
   alert(value);
}


Mais lorsque je clique sur html_content :
- Une fenêtre de dialogue s'affiche avec le nom : html_content_text
Et lorsque je clique sur html_content_text :
- Deux fenêtres s'ouvrent avec comme nom : html_content_text

Quelqu'un aurais une idée d'où cela peut venir ?

Cordialement

pmcoste · Answer

Bonjour,

Ce fonctionnement est normal, tu créés deux évènements :
- 1 sur html_content
- 1 sur html_content_text

Et comme ces deux div sont imbriquées, lorsque tu cliques sur "html_content_text", les deux évènements sont exécutés : c'est comme si tu cliquais sur tes deux div.

Ton autre problème, à savoir que tu récupères deux fois le même texte "html_content_text", c'est également normal, car au moment du click, le javascript va récupérer le dernier "obj_id" généré. Pour résoudre ce problème, il faut faire une closure :

function load_javascript()
{
   var div = document.getElementsByTagName("div");
   for (var i = 0; i < div.length; i++) { 
      var obj = div[i];
      var obj_id = obj.id;
      obj.onclick = (function (id) {return function(){ click(id); return false};})(obj_id);
   } 
}

---------------------
Oderint dum metuant

Onclick sur conteneur div

1 réponse

Votre réponse

Discussions similaires