Liste Déroulante - faire apparaître et disparaître des éléments [Résolu]

crush911 · 03/10/2011, 19h29

Bonjour,

je débute en javascript en faisant des petits exercices. J'ai créer un menu déroulant et lorsqu'on choisi un élément du menu un paragraphe apparaît.

Ca fonctionne mais j'aimerais savoir comment faire pour faire disparaître le paragraphe qui est afficher lorsque je choisi un autre élément du menu. Présentement tout s'affiche à la suite de l'autre

merci

voici le 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
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
 
<SCRIPT language="JavaScript">
 
 
function affichage() //écriture de la fonction
{ 
var selectValue = document.getElementById('select').options[document.getElementById('select').selectedIndex].value;
 document.getElementById(selectValue).style.visibility='visible';
 
} 
</script>
</head>
 
<body>
 <select id="select" onchange="affichage();">
 <option >Choisir...</option>
    <option value="contrat">Contrat</option>
    <option value="employe">Employe</option>
    <option value="materiel">Materiel</option>
    <option value="prestataire">Prestataire</option>
    <option value="verification">Verifiaction</option>
  </select>
 
  <p id="contrat" style="visibility:hidden">Contrat</p>
    <p id="employe" style="visibility:hidden">Employe</p>
      <p id="materiel" style="visibility:hidden">Materiel</p>
        <p id="prestataire" style="visibility:hidden">prestataire</p>
          <p id="verification" style="visibility:hidden">verification</p>
 
 
</body>

vermine · 03/10/2011, 22h11

Bonsoir,

Tout d'abord, nous n'utilisons plus cette syntaxe-ci :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<SCRIPT language="JavaScript">

Mais bien celle-là :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<script type="text/javascript">

Ensuite, s'offrent à vous plusieurs possibilités. L'une d'entre elle, peut-être pas la plus adéquate, est de refaire disparaitre tous les paragraphes avant d'afficher celui que vous désirez :

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
 
function affichage() //écriture de la fonction
{ 
     //Récupération des balises <p>
     var tab_p = document.getElementsByTagName("P");
 
     //Parcours de tous les <p>
     for(var i=0; i<tab_p.length; i++)
     {
          //Les cacher un par un
          tab_p[i].style.visibility = 'hidden';
     }
 
     //Afficher celui sélectionné
     var selectValue = document.getElementById('select').options[document.getElementById('select').selectedIndex].value;
     document.getElementById(selectValue).style.visibility='visible';
}

crush911 · 04/10/2011, 22h04

merci

vermine · 05/10/2011, 08h11

Ca fonctionne ? Votre problème est résolu ?

N'hésitez pas à utiliser le bouton

qui se trouve en bas de cette discussion.

04/10/2011, 22h04	#3
crush911 Invité de passage Inscription : février 2011 Messages : 8 Détails du profil Informations forums : Inscription : février 2011 Messages : 8 Points : 1 Points : 1	merci
	00

05/10/2011, 08h11	#4
vermine Responsable JavaScript & AJAX Inscription : mars 2008 Messages : 2 690 Détails du profil Informations personnelles : Âge : 27 Informations forums : Inscription : mars 2008 Messages : 2 690 Points : 5 763 Points : 5 763	Ca fonctionne ? Votre problème est résolu ? N'hésitez pas à utiliser le bouton qui se trouve en bas de cette discussion. __________________ Elen Poukram - Isegoria - Sandawe
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email