Erreur child

Résolu
korka -  
 korka -
Bonjour,

j'ai une petite érreur

TypeError: node is null

var child_nodes_temp = node.childNodes;

    function childs(node)
    {
        var child_nodes_temp = node.childNodes;
        var child_nodes = new Array();
        for(var k = 0; k < child_nodes_temp.length; k++)
        {
            if(child_nodes_temp[k].nodeType == 1)
            {
                child_nodes.push(child_nodes_temp[k]);
            }
        }
        return child_nodes;
    }


merci de votre aide

il faut mettre une condition avec if ou else

si vous pouvez prendre le temps merci de votre aide

10 réponses

  1. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
     
    Bonjour,

    Tu peux en effet mettre un if ....
    par exemple :
    function childs(node)
    {
      var child_nodes = new Array();
      if(typeof(node) !='undefined' && node != null ){
         var child_nodes_temp = node.childNodes;
         for(var k = 0; k < child_nodes_temp.length; k++) {
           if(child_nodes_temp[k].nodeType == 1) {
              child_nodes.push(child_nodes_temp[k]);
           }
        }
      }
     return child_nodes;
    }
    


    0
    1. korka
       
      merci j'ai c corriger et ca me fait une autre erreur

      j'ai remplacer ce code

          function next(node)
          {
              var next = node.nextSibling;
              while(next && next.nodeType != 1)
              {
                  next = next.nextSibling;
              }
              return next;
          }
          /*
              Retourne les Noeud du DOM (hors noeud de text) enfants du node donné
          */
      


      par

          function next(node)
          {
              var next = node.nextSibling;
        if(typeof(next) !='undefined' && next != null ){
              while(next && next.nodeType != 1)
         if(next[k].nodeType == 1) {       {
                  next = next.nextSibling;
        }
              }
              }
              return next;
          }
      


      il me met toujours cete ereur

      ReferenceError: k is not defined
      	
      
      if(next[k].nodeType == 1) {       {
      
      	


      et ensuite on vera apres on ferra bug par bug

      merci
      0
  2. korka
     
    bonsoir donc j'ai refait le code

        function next(node)
        {
     if(node.nextSibling == 1) {   
     
     var next = node.nextSibling;
     
     if(next.nodeType == 1) { 
     while(next && next.nodeType != 1)
            {
                next = next.nextSibling;
              }
           }
             }
           return next;
        }
    


    il me dit

    TypeError: node is undefined
    	
    
    if(node.nextSibling == 1) {


    merci
    0
    1. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
       
      Où est passé le code que je t'ai donné ????
      Tu passes un paramètre : node ... avant de l'utiliser... il serait bien de t'assurer qu'il existe et n'est pas null .... d'où le code que je t'avais donné !
       if(typeof(node) !='undefined' && node != null){
      


      par contre.... que veux tu faire avec ton code ???
      Si c'est pour trouver le dernier élément.... il existe le lastElementChild tu sais ?
      0
  3. korka
     
    enfaîte je te donne le code entier sans les modification faite afin que tu puisses voir si c'est bien ou il faut une petite modification à recorriger

    /*
            On récupčre la SECTION principale.
            C'est dans celle-ci que le script va travailler
        */
        var main_section = document.getElementById('main_section');
         
        /*
            On initialise les MENUs et les PAGEs
            C'est ŕ dire qu'on active le premier
                TAB (onglet) de chaque SECTION
                et on affiche la PAGE correspondante
        */
        var menu = childs(main_section)[1];
        reset(menu);
         
        /*
            Cette fonction va selectionner le premier TAB du MENU fourni,
                et afficher la PAGE correspondante en faisant un RESET des
                MENUs qui sont dans le CONTENT
        */
        function reset(menu)
        {
            // En paralčlle au menu est le contenu Cf HTML
            var content = next(menu);
             
            // On reset le menu courant
            var tabs = childs(menu);
            for(var k = 0; k < tabs.length; k++)
            {
                // Si c'est le premier onglet du menu
                if(k == 0)
                {
                    $(tabs[k]).removeClass('unactive').addClass('active');
                    tabs[k].onclick = function(){ return false; };
                }
                // Sinon ..
                else
                {
                    $(tabs[k]).removeClass('active').addClass('unactive');
                    tabs[k].onclick = function(){ click(this); };
                }
            }
             
            // On reset les pages courantes
            var pages = childs(content);
            for(var k = 0; k < pages.length; k++)
            {
                if(k == 0)
                {
                    $(pages[k]).removeClass('undisplayed').addClass('displayed');
                }
                else
                {
                    $(pages[k]).removeClass('displayed').addClass('undisplayed');
                }
            }
             
            // On RESET les menus des pages
            var menus = content.getElementsByClassName('menu');
            for(var k = 0; k < menus.length; k++)
            {
                reset(menus[k]);
            }
        }
        /*
            Cette fonction selectionne le TAB fourni, active la PAGE correspondante,
                et RESET les MENUs du CONTENT.
        */
        function click(tab)
        {
            // Menu et content
            var menu = tab.parentNode;
            var content = next(menu);
             
            // On reset le menu courant
            var tabs = childs(menu);
            var n = -1;
            for(var k = 0; k < tabs.length; k++)
            {
                // Si c'est l'onglet sur lequel on a cliqué
                if(tabs[k] == tab)
                {
                    n = k;
                    $(tabs[k]).removeClass('unactive').addClass('active');
                    tabs[k].onclick = function(){ return false; };
                }
                // Sinon ...
                else
                {
                    $(tabs[k]).removeClass('active').addClass('unactive');
                    tabs[k].onclick = function(){ click(this); };
                }
            }
             
            // On reset les pages courantes
            var pages = childs(content);
            for(var k = 0; k < pages.length; k++)
            {
                if(k == n)
                {
                    $(pages[k]).removeClass('undisplayed').addClass('displayed');
                }
                else
                {
                    $(pages[k]).removeClass('displayed').addClass('undisplayed');
                }
            }
             
            // On reset les menus des pages courantes
            var menus = content.getElementsByClassName('menu');
            for(var k = 0; k < menus.length; k++)
            {
                reset(menus[k]);
            }
        }
         
        /*
            Retourne le Noeud du DOM (hors noeud de text) suivant le node donné
        */
        function next(node)
        {
            var next = node.nextSibling;
            while(next && next.nodeType != 1)
            {
                next = next.nextSibling;
            }
            return next;
        }
        /*
            Retourne les Noeud du DOM (hors noeud de text) enfants du node donné
        */
        function childs(node)
        {
            var child_nodes_temp = node.childNodes;
            var child_nodes = new Array();
            for(var k = 0; k < child_nodes_temp.length; k++)
            {
                if(child_nodes_temp[k].nodeType == 1)
                {
                    child_nodes.push(child_nodes_temp[k]);
                }
            }
            return child_nodes;
        }


    il y a une erreur à ligne

    TypeError: node is null
    	
    
    var child_nodes_temp = node.childNodes;
    
    	
    container.js (ligne 134, col. 13)


    j'ai remplacer ce code :

        function childs(node)
        {
            var child_nodes_temp = node.childNodes;
            var child_nodes = new Array();
            for(var k = 0; k < child_nodes_temp.length; k++)
            {
                if(child_nodes_temp[k].nodeType == 1)
                {
                    child_nodes.push(child_nodes_temp[k]);
                }
            }
            return child_nodes;
        }


    par

    function childs(node)
    {
      var child_nodes = new Array();
      if(typeof(node) !='undefined' && node != null ){
         var child_nodes_temp = node.childNodes;
         for(var k = 0; k < child_nodes_temp.length; k++) {
           if(child_nodes_temp[k].nodeType == 1) {
              child_nodes.push(child_nodes_temp[k]);
           }
        }
      }
     return child_nodes;
    }


    ensuite une erreur à ligne

    TypeError: node is undefined
    	
    
    var next = node.nextSibling;
    
    	
    container.js (ligne 122, col. 13


    j'ai remplacer ce code :

        function next(node)
        {
            var next = node.nextSibling;
            while(next && next.nodeType != 1)
            {
                next = next.nextSibling;
            }
            return next;
        }
    


    par

        function next(node)
        {
       if(typeof(next) !='undefined' && next != null ){
           var next = node.nextSibling;
            while(next && next.nodeType != 1)
            {
                next = next.nextSibling;
      }
            }
            return next;
        }
    


    ensuite ca me fait une erreur à ligne

    TypeError: content is undefined
    	
    
    var menus = content.getElementsByClassName('menu');
    
    	
    container.js (ligne 59, col. 13)
    TypeError: content is undefined
    	
    
    var menus = content.getElementsByClassName('menu');
    
    	
    container.js (ligne 110, col. 13)


    j'ai un doute pour remplacer

    le code ligne 59

            // On RESET les menus des pages
            var menus = content.getElementsByClassName('menu');
            for(var k = 0; k < menus.length; k++)
            {
                reset(menus[k]);
            }
    


    le code ligne 110

            // On reset les menus des pages courantes
            var menus = content.getElementsByClassName('menu');
            for(var k = 0; k < menus.length; k++)
            {
                reset(menus[k]);
            }
    


    voilà ou j'en suis

    le code est censé quand tu clique sur un menu ca change de page
    0
    1. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
       
      Plusieurs choses me choquent dans ton code....
      déjà... pourquoi mélanges tu du jquery et du javascript 'standard' ?
      Ensuite... pourquoi as tu deux class : active et unactive ? ...... si un menu est actif ... il a la class active.... sinon il ne l'a pas..... je ne vois pas l'interet d'en avoir deux.

      En plus ... sans avoir le HTML qui va avec... ton code ne me sert à rien !

      Ta fonction reset ... pourrait se résumer à
      $('.menu').removeClass('active');
      $('.menu').first().addClass('active');
      
      0
  4. korka
     
    merci

    voilà le html

                                                                                                     <!--  <!-- D&eacutebut Menu MainSection -->
    
     <section id="main_section" class="section">
    																								 																								 
    																								 <!-- MEME SI VIDE, TOUJOURS LAISSER CE H2 - LE CSS PEUT LE RENDRE INVISIBLE EN CAS DE BESOIN
    																								 SI VRAIMENT GENANT, IL PEUT ETRE RETIRER A CONDITION DE REMPLACER "childs(MainSection)[1]"
    																								 PAR childs(MainSection)[0] ET DE FAIRE ATTENTION ... -->
    																								 
    																								 <h2> </h2>
    
    																								 <!-- D&eacutebut Menu principaux -->
    																								
    																								 <ul class="menu">
    																												  <li class="tab icon-minichatconversationsupprimer">Les salons</li>
    																												  <li class="tab icon-minichatconversationsupprimer">#1salon</li>
    																												  <li class="tab icon-minichatconversationsupprimer">#2salon</li>
    																												  <li class="tab icon-minichatconversationsupprimer">#3salon</li>
    																												  <li class="tab icon-minichatconversationsupprimer">#4salon</li>
    																												  <li class="tab icon-minichatconversationsupprimer">#5salon</li>
    																												  <li class="tab icon-minichatconversationsupprimer">pseudo</li>
    																												  <li class="tab icon-minichatconversationsupprimer">pseudo</li>
    																												  <li class="tab icon-minichatconversationsupprimer">pseudo</li>
    																												  <li class="tab icon-minichatconversationsupprimer">pseudo</li>
    																												  <li class="tab icon-minichatconversationsupprimer">pseudo</li>
    																								 </ul>
    																								
                              <!-- D?but de la content -->
    						  
    						  <div class="content">
    						  
    						                       <!-- D&eacutebut de la page Site-->
    											   
    											   <div class="page">
    											   
    											                     <!-- D&eacutebut de la content -->
    																 
    																 <div class='content'>
    																 
    																                      <!-- D&eacutebut de la page Site -->
    																					  
    																					  <div class='page'>
                                                                                                     
    																								                 <!-- D&eacutebut Menu section -->
    																												 
    																												 <div class="section">
    																								                                      <!-- D&eacutebut de la Menu -->
    																																	  
    																																	  <ul class="menu" id="menuminisalon">
    																																	                                      <li class="tab bouton_gauche">Salons Officiels</li>
    																																										  <li class="tab bouton_gauche">Salons Perso</li>
    																																										  <li class="tab bouton_droite">
    																																										  <button type="button" class="buttons poplight" data-width="500" data-rel="creersalon
    
    


    la si tu clique sur le menu salon 2 ca affiche le salon 2 donc il sera active les autre inactif

    le css sera

    /*********************************************************************************************************Début des menus contenaires****************************************************************************************************************************/
    
    
          #main_section
    	  {
    	  /* PAS NECESSAIRE POUR LE SCRIPT */
    	  width:auto;
    /*	  background-color:#CC00FF;*/
    	  }
    	  
    	  .section
    	  {
    	  /* PAS NECESSAIRE POUR LE SCRIPT */
    /*	  padding : 10px;*/
    /*	  background:#993399;*/
    	  }
    	  
          ul.menu
    	  {
    	  display:inline-flex;
    	  list-style-type:none; /* Car sinon les puces se placent n'importe o? */
    	  color:#000000;
    	  }
    
    	  ul.menu li
    	  {
    	  padding:0.625em;/* top right bottom left */
    	  }
    
    	  .tab
    	  {
    	  /* PAS NECESSAIRE POUR LE SCRIPT */
    	  padding : 5px;
    	  margin : 0 5px 0 0;
    	  float : left;
    	  position : relative;
    	  top : 1px;
    	  cursor : pointer;
    	  }
    	  
    	  .active     /* Les onglets selectionnés */
    	  {
    	  /* PAS NECESSAIRE POUR LE SCRIPT */
    /*    background : white;*/
          border : 1px solid #CCCCCC;
    	  border-bottom : 0px;
    	  }
    	  
    	  .unactive   /* Les onglets non selectionnés */
    	  {
    	  /* PAS NECESSAIRE POUR LE SCRIPT */
    /*    background : rgb(50,205,50);*/
    /*      border : 1px solid #CCCCCC;*/
    /*	  border-bottom : 0px;*/
    	  }
    	  
    	  .content
    	  {
    	  /* PAS NECESSAIRE POUR LE SCRIPT */
    /*    background : white;*/
          clear : both;
    /*	  overflow:hidden;*/
    	  }
    	  
    	  .page
    	  {
    	  /* PAS NECESSAIRE POUR LE SCRIPT */
    	  background : white;
    	  }
    	  
    	  .displayed      /* Les pages affichées */
    	  {
    	  }
    	  
    	  .undisplayed    /* Les pages non affichées */
    	  {
    	  /* NECESSAIRE POUR LE SCRIPT !!!! */
    	  display : none;
    	  }
    
    /*********************************************************************************************************Fin des menus contenaires******************************************************************************************************************************/
    


    là je t'ai tout mis

    si ta une autre méthode mieux que celui là
    avec un plaisir

    là je suis toujours bug sur ligne 59 js
    0
  5. Vous n’avez pas trouvé la réponse que vous recherchez ?

    Posez votre question
  6. korka
     
    j'ai corriger les bugs donc il n'y a plus de bug mais le script ne fonctionne pas quand je clique surles menue et sous menu

    voilà le code que j'ai recoriger

    /*
            On récupčre la SECTION principale.
            C'est dans celle-ci que le script va travailler
        */
        var main_section = document.getElementById('main_section');
         
        /*
            On initialise les MENUs et les PAGEs
            C'est ŕ dire qu'on active le premier
                TAB (onglet) de chaque SECTION
                et on affiche la PAGE correspondante
        */
        var menu = childs(main_section)[1];
        reset(menu);
         
        /*
            Cette fonction va selectionner le premier TAB du MENU fourni,
                et afficher la PAGE correspondante en faisant un RESET des
                MENUs qui sont dans le CONTENT
        */
        function reset(menu)
        {
            // En paralčlle au menu est le contenu Cf HTML
            var content = next(menu);
             
            // On reset le menu courant
            var tabs = childs(menu);
            for(var k = 0; k < tabs.length; k++)
            {
                // Si c'est le premier onglet du menu
                if(k == 0)
                {
                    $(tabs[k]).removeClass('unactive').addClass('active');
                    tabs[k].onclick = function(){ return false; };
                }
                // Sinon ..
                else
                {
                    $(tabs[k]).removeClass('active').addClass('unactive');
                    tabs[k].onclick = function(){ click(this); };
                }
            }
             
            // On reset les pages courantes
            var pages = childs(content);
            for(var k = 0; k < pages.length; k++)
            {
                if(k == 0)
                {
                    $(pages[k]).removeClass('undisplayed').addClass('displayed');
                }
                else
                {
                    $(pages[k]).removeClass('displayed').addClass('undisplayed');
                }
            }
             
            // On RESET les menus des pages
      if(typeof(menus) !='undefined' && menus != null ){
            var menus = content.getElementsByClassName('menu');
            for(var k = 0; k < menus.length; k++)
            {
                reset(menus[k]);
            }
             }
       }
        /*
            Cette fonction selectionne le TAB fourni, active la PAGE correspondante,
                et RESET les MENUs du CONTENT.
        */
        function click(tab)
        {
            // Menu et content
            var menu = tab.parentNode;
            var content = next(menu);
             
            // On reset le menu courant
            var tabs = childs(menu);
            var n = -1;
            for(var k = 0; k < tabs.length; k++)
            {
                // Si c'est l'onglet sur lequel on a cliqué
                if(tabs[k] == tab)
                {
                    n = k;
                    $(tabs[k]).removeClass('unactive').addClass('active');
                    tabs[k].onclick = function(){ return false; };
                }
                // Sinon ...
                else
                {
                    $(tabs[k]).removeClass('active').addClass('unactive');
                    tabs[k].onclick = function(){ click(this); };
                }
            }
             
            // On reset les pages courantes
            var pages = childs(content);
            for(var k = 0; k < pages.length; k++)
            {
                if(k == n)
                {
                    $(pages[k]).removeClass('undisplayed').addClass('displayed');
                }
                else
                {
                    $(pages[k]).removeClass('displayed').addClass('undisplayed');
                }
            }
             
            // On reset les menus des pages courantes
      if(typeof(menus) !='undefined' && menus != null ){
            var menus = content.getElementsByClassName('menu');
            for(var k = 0; k < menus.length; k++)
            {
                reset(menus[k]);
            }
             }
        }
         
        /*
            Retourne le Noeud du DOM (hors noeud de text) suivant le node donné
        */
        function next(node)
        {
       if(typeof(next) !='undefined' && next != null ){
           var next = node.nextSibling;
            while(next && next.nodeType != 1)
            {
                next = next.nextSibling;
      }
            }
            return next;
        }
        /*
            Retourne les Noeud du DOM (hors noeud de text) enfants du node donné
        */
    function childs(node)
    {
      var child_nodes = new Array();
      if(typeof(node) !='undefined' && node != null ){
         var child_nodes_temp = node.childNodes;
         for(var k = 0; k < child_nodes_temp.length; k++) {
           if(child_nodes_temp[k].nodeType == 1) {
              child_nodes.push(child_nodes_temp[k]);
           }
        }
      }
     return child_nodes;
    }


    merci
    0
  7. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
     
    Grosso modo.... tout ton code peut se traduire par :
    
        // initialisation : Aucun menu selectionné
        raz_menu();
    	
        // 	On retire la class active à tous les items du menu
    	function raz_menu(){
    	  $('#main_section > .menu > .tab').removeClass('active');
    	}
    	
    	// lors du clic sur un item .. 
    	$('#main_section > .menu > .tab').click(function(){
    	  raz_menu();   // On retire la class active à tous les items du menu
              $(this).addClass('active'); // on lui met la class active
    	});
    
    


    du moins... pour le menu "principal".
    Après... je ne sais pas de quoi tu parles lorsque tu parles des sous-menus vu que ton code html n'est pas complet....
    Mais bon.. ça te donne une idée de comment ça marche.

    Tu remarqueras que je n'ai pas mélangé de "pur" javascript et de jquery... TOUT est en jquery !

    0
    1. korka
       
      les sous menu

      je t'ai fait une capture

      http://hpics.li/060669c

      là ta l'onglet salon avec son sous menu qui salon officielle et perso

      ensuite si tu clique sur #2salon

      tu ne verras plus les sous menu perso et officielle car il appartient a celle du 1 onglet les salons et pas les autres

      en espérant tu peut cliquer sur la capture d'ecrant
      0
  8. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
     
    Donc :

    1 - Ajout d'une class "fictive" pour identifier les sous-menus
     <ul class="menu sousmenu"  id="menuminisalon">
    


    2 - Dans ton menu, ajout d'une info permettant d'indiquer l'id du sous menu à afficher :
    par exemple :
    <ul class="menu">
    	  <li class="tab icon-minichatconversationsupprimer" data-sm="menuminisalon">Les salons</li>
    	  <li class="tab icon-minichatconversationsupprimer">#1salon</li>
    	  <li class="tab icon-minichatconversationsupprimer">#2salon</li>
    	  <li class="tab icon-minichatconversationsupprimer">#3salon</li>
    


    ici : data-sm="menuminisalon" pour le premier menu.

    Puis le code js complet :
        // initialisation : Aucun menu selectionné
        raz_menu();
    	
        // 	On retire la class active à tous les items du menu
    	function raz_menu(){
    	  $('#main_section > .menu > .tab').removeClass('active'); // on retire tous les class active des menus
    	  $('.sousmenu').css("display", "none"); // tous les sous-menus sont masqués par défaut
    	}
    	
    	// lors du clic sur un item .. on lui met la class active
    	$('#main_section > .menu > .tab').click(function(){
    	  raz_menu();
    	  $(this).addClass('active'); 
    	  //affichage du sous-menu
    	  var id_sm = $(this).data('sm'); //on recupere l'id du sous-menu à afficher
    	  $("#"+id_sm).css("display", "block"); // on l'affiche
    	
    	});
    	
    	//lors du clic sur un sous-menu
    	$('.sousmenu > .tab').click(function(){
    	  $('.sousmenu > .tab').removeClass('active'); // on retire tous les "active" aux sous-menus
    	  $(this).addClass('active');  // on met la class active au menu cliqué
    	});
    
    0
  9. korka
     
    merci mais il n'y a pas de bug mais ca ne marche toujours pas

    je t'ai fait une page avec l'ancien code

    http://communautaire.legtux.org/V1/module/contenaireavant.php

    afin que tu puisse clique sur les onglets tu veras ceux qui appairait a chaque onglet et sous menu voir ceux que j'aimerais faire

    maintenant voilà la page avec les modification apporté avec toi

    http://communautaire.legtux.org/V1/module/contenaireapres.php

    les phrase disparaît pas lors du clique

    si tu veux on reprend ca demain
    0
    1. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
       
      En même temps ... tu n'as pas TOUT fait comme je te l'ai dit ...
      <!-- la on affiche encores des menu qui seront les sous menu du menu les salons -->
      <ul  class="menu" id="menuminisalon">
        <li class="tab bouton_gauche">Salons Officiels</li>
        <li class="tab bouton_gauche">Salons Perso</li>
        <li class="tab bouton_droite">
        <button type="button" class="buttons poplight" data-width="500" data-rel="creersalon">Créer un salon</button>
        </li>
      </ul>             
      

      Où est la class SOUSMENU ??
      0
      1. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830 > jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention  
         
        après ... pour l'affichage ou non des div correspondantes à tes sous-menus... là je te laisse faire.
        Je t'ai largement donné de quoi comprendre comment faire....
        Il faut que tu le fasses avec la même logique.
        - Une class pour pouvoir les manipuler (par exemple tu peux utiliser la class "page")
        - Un id pour identifier la page à afficher
        - un attribut DATA quelquechose (
        data-page='id_de_la_page' 
        par exemple ) dans le sous-menu pour identifier la page à afficher...
        0
    2. korka
       
      je verrais ca et je te tiendrais au courrant

      merci
      0
  10. korka
     
    je revien vers toi pour te dire j'ai compris mais ca fonctionne mai pas comi fault

    voilà la page teste

    je sais que je me suis tromper mais là je sèche

    je vais t'expliquer precisement

    qd tu actualise la page
    actuellement pour voir les sous menu il faut cliquer

    mais il faut lui dire sauf les 1, er onglet du menu et sous menu afin qu'on puisse voir le texte du 1 er onglet afin d’éviter de cliquer

    pour les sous menu ca ne veut pas cliquer

    j'ai bien mis data diffierent a chaque li

    je te met la page modifier

    http://communautaire.legtux.org/V1/module/contenaire.php

    et le code

    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="fr" class="vbulletin_html">
    <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width" /><title>Document sans titre</title>
    <link rel="stylesheet" type="text/css" href="http://communautaire.legtux.org/V1/design/Basic/style.css">
    </head>
    <body>
    
    
                                                                                                     <!-- D&eacutebut Menu MainSection -->
    
                                                                                                     <section id="main_section" class="section">
    																								 																								 
    																								 <!-- MEME SI VIDE, TOUJOURS LAISSER CE H2 - LE CSS PEUT LE RENDRE INVISIBLE EN CAS DE BESOIN
    																								 SI VRAIMENT GENANT, IL PEUT ETRE RETIRER A CONDITION DE REMPLACER "childs(MainSection)[1]"
    																								 PAR childs(MainSection)[0] ET DE FAIRE ATTENTION ... -->
    																								 
    																								 <h2> </h2>
    
    																								 <ul class="menu">
    																												  <li class="tab icon-minichatconversationsupprimer" data-sm="menuminisalon">Les salons</li>
    																												  <li class="tab icon-minichatconversationsupprimer" data-sm="menuminisalon1">#1salon</li>
    																												  <li class="tab icon-minichatconversationsupprimer" data-sm="menuminisalon2">#2salon</li>
    																												  <li class="tab icon-minichatconversationsupprimer" data-sm="menuminisalon3">#3salon</li>
    																								 </ul>
    
    
    
    
                                                                                                     <!--début on affiche les les salon officielle et perso-->
    																								 <div class="menu" id="menuminisalon">
    																								 
    																								                  <ul class="menu">
    																												  <li class="tab icon-minichatconversationsupprimer" data-sm="menuminisalonofficielle">Les salons offocielle</li>
    																												  <li class="tab icon-minichatconversationsupprimer" data-sm="menuminisalonperso">Les salons perso</li>
    																												  </ul>
    																								 
                                                                                                     <!--début on affiche les salon officielle-->																						   
    																								 <div class="menu" id="menuminisalonofficielle">officielle</div>
    																								 <!--Fin on affiche les salon officielle-->																						   
    																								 <!--début on affiche les salon perso-->																						   
    																								 <div class="menu sousmenu" id="menuminisalonperso">perso</div>
    																								 <!--Fin on affiche les salon perso-->																						   
    																								 </div>
    																								 <!--Fin on affiche les les salon officielle et perso-->
    																								 
    																								 
    																								 
    																								 <!--début on affiche les les salon 1-->																						   
    																								 <div class="menu sousmenu"  id="menuminisalon1">on affiche le 1 salon</div>
    																								 <!--Fin on affiche les les salon 1-->
    																								 
    																								 
    																								 <!--début on affiche les les salon 2-->
    																								 <div class="menu sousmenu" id="menuminisalon2">on affiche le 2 salon</div>
    																								 <!--fin on affiche les les salon 2-->
    																								 
    																								 
    																								 <!--début on affiche les les salon 3-->
    																								 <div class="menu sousmenu" id="menuminisalon3">on affiche le 3 salon</div>
    																								 <!--fin on affiche les les salon 3-->
    
    																								 </section>
    																								 
                                                                                                     <!-- Fin Menu MainSection -->
    
    
    <script type="text/javascript" src="http://communautaire.legtux.org/V1/includes/jquery/jquery-1.12.3.min.js"></script>
    
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    
    <script type="text/javascript">
       // initialisation : Aucun menu selectionné
        raz_menu();
    	
        // 	On retire la class active à tous les items du menu
    	function raz_menu(){
    	  $('#main_section > .menu > .tab').removeClass('active'); // on retire tous les class active des menus
    	  $('.sousmenu').css("display", "none"); // tous les sous-menus sont masqués par défaut
    	}
    	
    	// lors du clic sur un item .. on lui met la class active
    	$('#main_section > .menu > .tab').click(function(){
    	  raz_menu();
    	  $(this).addClass('active'); 
    	  //affichage du sous-menu
    	  var id_sm = $(this).data('sm'); //on recupere l'id du sous-menu à afficher
    	  $("#"+id_sm).css("display", "block"); // on l'affiche
    	
    	});
    	
    	//lors du clic sur un sous-menu
    	$('.sousmenu > .tab').click(function(){
    	  $('.sousmenu > .tab').removeClass('active'); // on retire tous les "active" aux sous-menus
    	  $(this).addClass('active');  // on met la class active au menu cliqué
    	});
    	
    	
    	
    	
    	
    		</script>
    
    
    
    </body>
    </html>
    


    en attendant ta réponse je vais reflechir

    merci
    0
  11. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
     
    Voila :

    <!DOCTYPE html>
    <html lang="fr">
    <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width">
     <title>Document sans titre</title>
     <!-- CSS -->
     <link rel="stylesheet" type="text/css" href="http://communautaire.legtux.org/V1/design/Basic/style.css">
     <!-- JQUERY -->
     <script type="text/javascript" src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
     </head>
    <body>
     <!-- Début Menu MainSection -->
     <section id="main_section" class="section">
    
     <h2> </h2>
    
     <ul class="menu">
      <li class="tab icon-minichatconversationsupprimer" data-sm="menuminisalon">Les salons</li>
      <li class="tab icon-minichatconversationsupprimer" data-sm="menuminisalon1">#1salon</li>
      <li class="tab icon-minichatconversationsupprimer" data-sm="menuminisalon2">#2salon</li>
      <li class="tab icon-minichatconversationsupprimer" data-sm="menuminisalon3">#3salon</li>
     </ul>
    
     <!--début on affiche les les salon officielle et perso-->
     <div class="sousmenu" id="menuminisalon">
      <ul class="menu">
      <li class="tab icon-minichatconversationsupprimer" data-page="menuminisalonofficielle">Les salons offocielle</li>
      <li class="tab icon-minichatconversationsupprimer" data-page="menuminisalonperso">Les salons perso</li>
      </ul>
     
     <!--début on affiche les salon officielle-->																						   
     <div class="page" id="menuminisalonofficielle">officielle</div>
     <!--Fin on affiche les salon officielle-->																						   
     <!--début on affiche les salon perso-->																						   
     <div class="page" id="menuminisalonperso">perso</div>
     <!--Fin on affiche les salon perso-->																						   
     </div>
     <!--Fin on affiche les les salon officielle et perso-->
     
     
     
     <!--début on affiche les les salon 1-->																						   
     <div class="sousmenu "  id="menuminisalon1">on affiche le 1 salon</div>
     <!--Fin on affiche les les salon 1-->
     
     
     <!--début on affiche les les salon 2-->
     <div class="sousmenu " id="menuminisalon2">on affiche le 2 salon</div>
     <!--fin on affiche les les salon 2-->
     
     
     <!--début on affiche les les salon 3-->
     <div class="sousmenu " id="menuminisalon3">on affiche le 3 salon</div>
     <!--fin on affiche les les salon 3-->
    
     </section>
     
     <!-- Fin Menu MainSection -->
    
    <script type="text/javascript">
       // initialisation : Aucun menu selectionné
        raz_menu();
    	init_menu(); //affichage du premier menu par défaut
    	
    	
    	function init_menu(){
    	  var premier_menu = $('#main_section > .menu > .tab').first();
    	  premier_menu.addClass('active');
    	  var id_sm = premier_menu.data('sm'); //on recupere l'id du sous-menu à afficher
    	  $("#"+id_sm).css("display", "block"); // on l'affiche
    	   $("#"+id_sm + '> ul > li.tab').first().addClass('active');
    
          var id_page = $("#"+id_sm +  '> ul > li.tab').first().data('page'); // on récupère l'id de la page (la div) à afficher
    	  $("#"+id_page ).css("display", "block"); // on affiche LA page selectionnée dans le sous-menu
    	}
    	
        // 	On retire la class active à tous les items du menu
    	function raz_menu(){
    	  $('#main_section > .menu > .tab').removeClass('active'); // on retire tous les class active des menus
    	  $('div.sousmenu').css("display", "none"); // tous les sous-menus sont masqués par défaut
    	  $('div.sousmenu > ul > li.tab').removeClass('active'); 
    	  $('div.page').css("display", "none"); // toutes les pages sont masquées par défaut
    	}
    	
    	// lors du clic sur un item .. on lui met la class active
    	$('#main_section > .menu > .tab').click(function(){
    	  raz_menu();
    	  $(this).addClass('active'); 
    	  //affichage du sous-menu
    	  var id_sm = $(this).data('sm'); //on recupere l'id du sous-menu à afficher
    	  $("#"+id_sm).css("display", "block"); // on l'affiche
    	
    	});
    	
    	//lors du clic sur un sous-menu
    	$('.sousmenu > ul >li.tab').click(function(){
    	  $('.sousmenu > ul >li.tab').removeClass('active'); // on retire tous les "active" aux sous-menus
    	  $(this).addClass('active');  // on met la class active au menu cliqué
    	  
    	  var id_page = $(this).data('page'); // on récupère l'id de la page (la div) à afficher
    	    $('div.page').css("display", "none"); // toutes les pages sont masquées par défaut
    	   $("#"+id_page).css("display", "block"); // on affiche LA page selectionnée dans le sous-menu
    	  
    	});
    	
    </script>
    
    
    
    </body>
    </html>
    


    Il y aura encore sûrement des ajustements à faire ...
    Mais cette fois..; TU PEUX t'en charger.

    Qui qu'il en soit... ta question initiale est traitée. Tu peux donc mettre cette discussion en RESOLUE et, si tu as d'autres questions/soucis ... ouvrir une nouvelle discussion.

    Bonne nuit.

    0
    1. korka
       
      merci je met la question résolu
      peut être je reviendrais te demander 1 ou 2 petit conseille mais sur html

      en tout cas je vais essayer d'analyser et remettre tout
      0
    2. korka
       
      excuse moi juste une petite question là ça fonctionne bien
      là on s'est occuper le cadre activ lors du 1 e r clique

      mais on a oublier de remettre les autres cadres qu'on a pas encore cliquer qui ont la class unactive

      es ce que je dois refaire une nouvelle fonction pour dire tout les latest ont aura une class unactive

      ou juste rajouter a côté active, unactive

      quand on clique on aura une class active
      et pour ceux qu'on a pas cliquer on aura une class unactive

      et ensuite ca sera bon

      merci et apres je mettrai résolu
      0
      1. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830 > korka
         
        1 - Tu me parles de la class "unactive" .. hors... dans le code que je t'ai donné je n'y fait nul part référence...

        2 - je t'ai demandé d'ouvrir une nouvelle discussion pour toute nouvelle question.

        3 - Je ne comprend pas ta question... il faudra que tu la reformules (dans une nouvelle discussion donc) plus clairement.
        - En montrant le code concerné
        - En expliquant en détail ce que le code fait
        - En expliquant en détail ce que le code devrait faire selon toi.
        0
      2. korka > jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention  
         
        ok je vais réfléchir un peut et voir et j'ouvrerais un nouveau mesage pour te dire ou ca coince en t'expliquant le mmieux possible

        car là je viens juste trouver une petite érreur sans importance

        mais là je vais come même esayer de refaire la page
        merci là je met en résolut et j'ouvrerai un autre topic ;)
        0