Sujet Précédent Sujet Suivant

Un menu li de 'display=none' à 'display=block' avec javascript

Résolu
Ouma.Lou Messages postés 2 Date d'inscription lundi 12 mai 2014 Statut Membre Dernière intervention 22 mai 2014 - 21 mai 2014 à 19:38
Ouma.Lou Messages postés 2 Date d'inscription lundi 12 mai 2014 Statut Membre Dernière intervention 22 mai 2014 - 22 mai 2014 à 15:44
Bonjour,
j'ai un menu animé par Jquery où j'ai mis display:none pour les "li", au dessus un combobox contennt les valeurs de 1 à 5, ce que je veux de ma fonction valid() en javascript c'est de rendre le nombre choisit des "li" en display:block !! voilà le code que j'ai essayé avec mais ça n'a pas marché ! 


 function valid(a)
{        
     var x = (a.value || a.options[a.selectedIndex].value);
    
    for (i=2;i < 6;i++)
	{
    document.getElementById('mod'+i).display =none;
    }

    for(i=2; i<=x;i++)
    {
         document.getElementById('mod'+i).display =block;
    }
    
    x = (a.value || a.options[a.selectedIndex].value);
	


    
}




 
<div id="wb_Text75">
<span>Nembre de sous-modules :</span></div>
<select name="prof1" size="1" id="choixinput" onchange="valid(this);">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
...

<ul>
<li id='1'><a href="#jquerytabs1-page-0"><span>Sous-module 1</span></a></li>
<li id='mod2'><a href="#jquerytabs1-page-1"><span>Sous-module 2</span></a></li>
<li id='mod3'><a href="#jquerytabs1-page-2"><span>Sous-module 3</span></a></li>
<li id='mod4'><a href="#jquerytabs1-page-3"><span>Sous-module 4</span></a></li>
<li id='mod5'><a href="#jquerytabs1-page-4"><span>Sous-module 5</span></a></li>
</ul>






#mod2, #mod3, #mod4, #mod5
{
	display:none;
}

3 réponses

Réponse 1 / 3
jordane45 Messages postés 37523 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 4 juin 2023 341
22 mai 2014 à 10:28
Bonjour,

voilà le code que j'ai essayé avec mais ça n'a pas marché !

-En quoi ça n'a pas marché ?
-Quel est le comportement observé ?
-As-tu essayé de mettre des ALERT pour voir si ton script se lance... les valeurs de tes variables...etc..
-As-tu essayé de regarder ce que le debogueur de ton navigateur ( sous fireFox.. firebug... ) pour voir si ça te donnes des messages d'erreur ?
0
Réponse 2 / 3
jordane45 Messages postés 37523 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 4 juin 2023 341
22 mai 2014 à 10:40
Tu as oublié :

.style.display

Tu n'as pas mis de quotes (guillemets) autour de none et block 

<script type="text/javascript">
function valid(a){        
     var x = (a.value || a.options[a.selectedIndex].value);
    console.log(x)
    for (i=2;i < 6;i++)	{
      document.getElementById('mod'+i).style.display ="none";
    }

    for(i=2; i<=x;i++){
      document.getElementById('mod'+i).style.display ="block";
    }
    
    //La ligne ci-dessous ne sert à rien...
		//x = (a.value || a.options[a.selectedIndex].value);    
}
</script>

0
Réponse 3 / 3
Ouma.Lou Messages postés 2 Date d'inscription lundi 12 mai 2014 Statut Membre Dernière intervention 22 mai 2014
22 mai 2014 à 15:44
merci infiniment jordane45, c'était le ".style" qui manque!!
0
Rejoignez-nous