IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

évènement onclick dynamique


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre éclairé
    Inscrit en
    Avril 2007
    Messages
    521
    Détails du profil
    Informations forums :
    Inscription : Avril 2007
    Messages : 521
    Par défaut évènement onclick dynamique
    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 : 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
    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 : Sélectionner tout - Visualiser dans une fenêtre à part
    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 : 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
    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

  2. #2
    Rédacteur

    Avatar de Bovino
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2008
    Messages
    23 647
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 55
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Juin 2008
    Messages : 23 647
    Billets dans le blog
    20
    Par défaut
    Je comprends pas trop pourquoi tu te compliques la vie en essayant de dissocier IE et FF

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    nouveauDiv.className = "cliquable");
    nouveauDiv.onclick = function(){series(4);}
    devrait être largement suffisant.
    Pas de question technique par MP !
    Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi !
    Mes formations video2brain : La formation complète sur JavaScriptJavaScript et le DOM par la pratiquePHP 5 et MySQL : les fondamentaux
    Mon livre sur jQuery
    Module Firefox / Chrome d'intégration de JSFiddle et CodePen sur le forum

  3. #3
    Membre éclairé
    Inscrit en
    Avril 2007
    Messages
    521
    Détails du profil
    Informations forums :
    Inscription : Avril 2007
    Messages : 521
    Par défaut
    merci mais j'avais déjà résolu le problème grâce à la même solution que la tienne
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    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 : 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
    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 : Sélectionner tout - Visualiser dans une fenêtre à part
    alert("nb noeud "+noeud.childNodes.length);
    me donne constamment le même nombre de noeud ça me paraît bizarre.

  4. #4
    Membre éclairé
    Inscrit en
    Avril 2007
    Messages
    521
    Détails du profil
    Informations forums :
    Inscription : Avril 2007
    Messages : 521
    Par défaut
    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

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Pb Création évènement OnClick
    Par BigMike dans le forum C++Builder
    Réponses: 10
    Dernier message: 26/06/2006, 15h47
  2. événement onclick intempestif d'1 TMenuItem
    Par OutOfRange dans le forum Delphi
    Réponses: 6
    Dernier message: 22/06/2006, 20h46
  3. Changement dynamique de l'évènement OnClick
    Par cluis dans le forum Access
    Réponses: 3
    Dernier message: 22/03/2006, 11h30
  4. Erreur avec l'évènement OnClick de ListView
    Par xenos dans le forum Composants VCL
    Réponses: 2
    Dernier message: 21/03/2006, 14h54
  5. Modification de l'évènement OnClick
    Par MrJéjé dans le forum C++Builder
    Réponses: 9
    Dernier message: 22/08/2002, 12h52

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo