évènement onclick dynamique [Résolu]

[sebac]

Bonjour, je créé grâce à Dom des noeuds(Examens) dynamiquement et ça marche mais lorsque j'attribue à ces noeuds un évènement onclick mon code ne marche plus. Voici le code de création

Code :

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
27
28
29
30
31
for(var i=0;i<nbExam;i++)
	 {
 
		// création des nouveaux noeuds
		var nouveauLi = document.createElement('li');
		var nouveauDiv = document.createElement('div');
		var nouveauLabel = document.createTextNode("Examen "+(i+1));
 
		 // lui donne un attribut class appelé cliquable défini dans le css  
		 nouveauDiv.setAttribute("className", "cliquable");//pour IE
		 nouveauDiv.setAttribute("class", "cliquable"); //pour ff
		 /*Il n'est pas nécessaire d'ajouter une détection du navigateur ci dessus, le 
		 code non compris par chacun des navigateurs ne générant pas d'erreur.*/
 
		 //sur clic des div créés appel de la fonction de création des séries
		 nouveauDiv.onclick = series('4');//ie
		 nouveauDiv.setAttribute("onclick","javascript:series(4);");//ff
 
        // raccord des noeuds
		nouveauDiv.appendChild(nouveauLabel);
		nouveauLi.appendChild(nouveauDiv);
		var insertAvantMoi=document.getElementById('series');
		var parentUl=insertAvantMoi.parentNode;
		parentUl.insertBefore(nouveauLi, insertAvantMoi);
 
 
 
 
 
	 }
  }

le bout de code incriminé c'est celui qui est censé déclenché un autre évènement lors du clic sur les div précédemment créés, le voici

Code :

1
2
3
 //sur clic des div créés appel de la fonction de création des séries
		 nouveauDiv.onclick = series('4');//ie
		 nouveauDiv.setAttribute("onclick","javascript:series(4);");//ff

En effet cette appel déclenche une erreur qui ne me permet même plus de créer les examens. La fonctions séries quand à elle est chargé lors du clic sur les examens d'effacer les series qu'ils y'avaient avant et d'en recréer de nouvelles. Voici sont code

Code :

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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
function series(nbSeries)
  {
		var noeud = document.getElementById('menu');
 
		// j'efface les ancien noeud fils dont className=="ulnoeud"
		 for(var i=0;i<noeud.childNodes.length;i++)
		 {
 
		     if((noeud.childNodes[i]).getAttribute("className")=="ulnoeud")//ie
			 {
				noeud.removeChild(noeud.childNodes[i]);
			 }
			 else
			 {
			    if((noeud.childNodes[i]).getAttribute("class")=="ulnoeud")//ff
				{
					noeud.removeChild(noeud.childNodes[i]);
				}
			 }
		 }
 
    // recréation des nouvelle séries
		for(var i=0;i<nbSeries;i++)
		{
 
			// création des nouveaux noeuds
			var nouveauLi = document.createElement('li');
			 // lui donne un attribut class appelé cliquable défini dans le css  
			 nouveauLi.setAttribute("className", "ulnoeud");//pour IE
			 nouveauDiv.setAttribute("class", "ulnoeud"); //pour ff
			 /*Il n'est pas nécessaire d'ajouter une détection du navigateur ci dessus, le 
			 code non compris par chacun des navigateurs ne générant pas d'erreur.*/
 
			var nouveauDiv = document.createElement('div');
			var nouveauLabel = document.createTextNode("Series "+(i+1));
 
			// raccord des noeuds
			nouveauDiv.appendChild(nouveauLabel);
			nouveauLi.appendChild(nouveauDiv);
			var insertAvantMoi=document.getElementById('images');
			var parentUl=insertAvantMoi.parentNode;
			parentUl.insertBefore(nouveauLi, insertAvantMoi);
 
 
		}
  }

Comment donc créer dynamiquement mon onclick
Merci

[Bovino]

Je comprends pas trop pourquoi tu te compliques la vie en essayant de dissocier IE et FF

Code :

1
2
nouveauDiv.className = "cliquable");
nouveauDiv.onclick = function(){series(4);}

devrait être largement suffisant.

[sebac]

merci mais j'avais déjà résolu le problème grâce à la même solution que la tienne

Code :

nouveauDiv.onclick = function(){series(4);}

mais seulement j'ai un autre problème ma fonction series est bien exécutée et me crée des series: series1 à 4 sauf que la première partie du code qui est chargé d'effacer les series existante dans la fonction series(nbSeries) ne fonctionne pas, la voici

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
var noeud = document.getElementById('menu');
		alert("nb noeud "+noeud.childNodes.length);
		// j'efface les ancien noeud fils dont className=="ulnoeud"
		 for(var i=0;i<noeud.childNodes.length;i++)
		 {
 
		     if((noeud.childNodes[i]).getAttribute("className")=="ulnoeud")//ie
			 {
				noeud.removeChild(noeud.childNodes[i]);
			 }
			 else
			 {
			    if((noeud.childNodes[i]).getAttribute("class")=="ulnoeud")//ff
				{
					noeud.removeChild(noeud.childNodes[i]);
				}
			 }
		 }

si je clic sur le div chargé d'appeler la fonction series il va me créer de nouvelles series à chaque fois sans effacer les précédente donc au lieu de me retrouver avec 4 series je me retrouve avec 4*nbclic series. Je rajoute des noeuds mais

Code :

alert("nb noeud "+noeud.childNodes.length);

me donne constamment le même nombre de noeud ça me paraît bizarre.

[sebac]

j'ai pu résoudre mon problème en fait la partie du code chargée de me créer des noeuds fils le faisait bien mais le problème c'est que je cherchait à les effacer à partir du mauvais noeud père.
Merci