[DOM] Valeur d'une variable à la création d'un fonction en DOM

**nihaoma** · 30/10/2006, 16h17

Bonjour tout le monde,

je me permes de faire appel à la communauté car j'ai un petit soucis en utilisant DOM et ne parvient pas à le résoudre.

Un dessin vaut parfois mieux qu'un long discours, alors voici le code suivant (j'explique le soucis après)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
 
var Tableau = new Array();
Tableau[1] = "Data 1"; Tableau[2] = "Data 2";
 
var MainUL = document.createElement("UL");
var MainLI = document.createElement("LI");
 
var MainLItext = document.createTextNode("Root");
MainLI.appendChild(MainLItext);
 
var SecondUL = document.createElement("UL");
 
for(Cpt = 1; Cpt <= Tableau.length - 1; Cpt++)
  {
    var cLI = document.createElement("IL");
    var cLItext = document.createTextNode(Tableau[Cpt]);
    cLI.appendChild(cLItext);
    cLI.onclick = function() {AfficheID(Cpt);}
 
    SecondUL.appendChild(cLI);
  }
 
  MainLI.appendChild(SecondUL);
  MainUL.appendChild(MainLI);
 
  document.appendChild(MainUL);

Mon soucis:

Comme vous pouvez le voir, je parcours un tableau Javascript, et à chaque ligne de ce tableau, je créer un élément de liste et affecte à la méthode "onclick()" une fonction. Mon souhaite, serais de passer en arguement de cette fonction l'ID de Tableau correspondant à l'élément. Au moment de l'execution du script, cet ID est donc représenté par la variable Cpt, le problème, c'est qu'une fois que le script est entièrement exécuté (et donc que je peux effectiver cliquer sur un élement de la liste), l'arguement qui est passé est toujours la dernière valeur qu'aura prit Cpt (en loccurence 2), mais jamais la valeur que Cpt avait au moment de la création de l'élément !

Comment faire pour que ce soit l'ID de mon élement qui passe en arguement ??? je ne peux bien sur par l'écrire en dur puisque je parcours le tableau pourtant, dès que je met une variable, cette variable étant commune à tous les élements (variable de la boucle de création des éléments) c'est systèmétiquement la dernière valeur de cette variable qui est passer...

sniff, plus, help...

merci par avance pour vos idées...

PS: ceci n'est pas l'intégralité de mon code, je l'ai allégé pour vous montrer le principal et surtout ce qui ne me va pas, aussi si j'ai fais une erreur de frappe ou que le code tel quel ne fonctionne pas exactement, ne vous inquiétez pas, il est là juste pour vous faire comprendre le contexte.

**SpaceFrog** · 30/10/2006, 16h35

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

this.id

en argument ?

**nihaoma** · 30/10/2006, 17h10

Envoyé par SpaceFrog

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

this.id

en argument ?

LOL

je suis idiot !

effectivement, il me suffit d'utilise un this.id, mais par contre, il faut avant que je fasse un truc du style

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
cLI.setAttribut("id",Cpt)

j'ai tester et ca fonctionne....

merci, et désolé pour l'idiotie de la chose...

**denisC** · 30/10/2006, 17h19

http://javascript.developpez.com/faq...lick.dynamique

**nihaoma** · 30/10/2006, 17h42

heu...oups, désolé, je regarderais mieux avant

par contre, j'ai un autre soucis (je n'ai pas encore vérifier dans le forum, mais puisque je suis en train de poster...lol)

avec le script que je vous ai montrer, j'obtient donc une architecture du style:

<ul>
<il onclick="mafonction(1)">Main</il>
<ul>
<il onclick="mafonction(2)">Data 1</il>
<il onclick="mafonction(3)">Data 2</il>
</ul>
</il>
</ul>

et ce qui est étrange, c'est que dans je clic sur "Data 1" ou "Data 2", "mafonction()" est bien appelé avec l'arguement 2 ou 3, mais elle est aussi appeler toute de suite après avec l'arguement 1...

bref, je vais chercher ca doit s'expliquer assez simplement...c'était juste au cas ou

merci en tous cas

bonne prog à tous !

Aurélien

**SpaceFrog** · 31/10/2006, 08h32

normal car le onclick des li enfant se repercute sur le li parent...
fais une recherche avec "cancelbubble" pour stopper le propagation de l'évènement onclick du li enfant au li parent

**denisC** · 31/10/2006, 10h00

Envoyé par SpaceFrog

normal car le onclick des li enfant se repercute sur le li parent...
fais une recherche avec "cancelbubble" pour stopper le propagation de l'évènement onclick du li enfant au li parent

Dis grenouille, dans son code, les lis sont pas imbriqués, si ?

Edit : bon, on va dire que tu as raison et qu'ils sont imbriqués. Mais c'est pas trop clair

**javatwister** · 31/10/2006, 10h05

jamais vu de balise il encore...

**SpaceFrog** · 31/10/2006, 10h11

Heu Denis là si y'a pas imbrication

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
<ul>
<li onclick="mafonction(1)">Main</li>
<ul>
<li onclick="mafonction(2)">Data 1</li>
<li onclick="mafonction(3)">Data 2</li>
</ul>
</li>
</ul>