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;
}

A voir également:

Javascript display none
Récupérer données json (javascript) - Conseils pratiques -Javascript
Javascript poo - Conseils pratiques -Javascript
Base de données javascript - Conseils pratiques -Javascript
Lien javascript - Forum Javascript / DHTML
Javascript goto ✓ - Forum Javascript / DHTML

3 réponses

Réponse 1 / 3

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 344
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 ?

Réponse 2 / 3

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 344
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>

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!!

Discussions similaires

Onclick : display=block et display=none d'un

style="display:none;" show('a')

Partie entiére d'un nombre

Masquer/ afficher dynamiquement une div (ou autre element) en Js

Display n'affiche pas le mail (envoi mail outlook via vba excel)

Votre réponse

Discussions similaires