Masquer/afficher un div via un menu select [Résolu]
cs_Quinze
- Messages postés
- 6
- Date d'inscription
- mercredi 26 mars 2003
- Dernière intervention
- 20 avril 2007
- Messages postés
- 6
- Date d'inscription
- mercredi 26 mars 2003
- Dernière intervention
- 20 avril 2007
A voir également:
- Javascript select
- Afficher div javascript - Meilleures réponses
- Select javascript - Meilleures réponses
- Masquer-afficher tous les select d'une page - Codes sources - Javascript (Formulaire)
- Masquer, afficher la barre de menu - Codes sources - PDA (PPC :: Trucs & Astuces)
- Masquer/ afficher dynamiquement une div (ou autre element) en Js ✓ - Forum - Javascript / DHTML
- Masquer/Afficher Div ✓ - Forum - Javascript / DHTML
- Lier votre application à internet explorer via le menu contextuel - Conseils pratiques - Visual Basic / VB.NET
3 réponses
Meilleure réponse
- Messages postés
- 13619
- Date d'inscription
- jeudi 13 février 2003
- Dernière intervention
- 15 octobre 2013
je ne sais pas pourquoi j'ai été mettre une boucle ici ?
à cette heure là, pas ma dose d'alcool nécessaire, sans doute...
<script type="text/javascript">
var p=document.getElementById("d1");
function affiche(sel)
{
p.style.visibility="hidden";
p=document.getElementById("d"+(sel.selectedIndex+1));
p.style.visibility="visible";
}
</script>
ça suffit bien
<hr />
Cordialement Bul [mon Site] [M'écrire]
<hr />
à cette heure là, pas ma dose d'alcool nécessaire, sans doute...
<script type="text/javascript">
var p=document.getElementById("d1");
function affiche(sel)
{
p.style.visibility="hidden";
p=document.getElementById("d"+(sel.selectedIndex+1));
p.style.visibility="visible";
}
</script>
ça suffit bien
<hr />
Cordialement Bul [mon Site] [M'écrire]
<hr />
Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire
91 internautes nous ont dit merci ce mois-ci
- Messages postés
- 13619
- Date d'inscription
- jeudi 13 février 2003
- Dernière intervention
- 15 octobre 2013
Bonjour,
un ch'tit exemple alors....
un
deux
trois
<script type="text/javascript">
function affiche(sel)
{
var n=1;
while ( document.getElementById("d"+n) )
{
document.getElementById("d"+n).style.visibility="hidden";
n++;
}
document.getElementById("d"+(sel.selectedIndex+1)).style.visibility="visible";
}
</script>
<form>
<select name="category" style="width:200px"
onchange="affiche(this);"
onfocus="this.selectedIndex=-1);">
<optgroup label="-CATEGORY-">
<option>un</option>
<option>deux</option>
<option>trois</option>
</optgroup>
</select>
</form>
remarques : un id doit commencer par une lettre.
on commence par cacher tous les div id="d#"
on affiche celui correspondant au n° de ligne sélectionné
( on aurait pu utiliser le .value, mais bof ... )
j'aime bien les <optgroup>
si le select n'a pas de size, ou s'il est =1,
la 1ère ligne est sélectionnées par défaut
( d'où la séselection au focus )
on pouvait utiliser style.display="none" ou "inline"
à adapter à ce qu'il faut.
<hr />
Cordialement Bul [mon Site] [M'écrire]
<hr />
un ch'tit exemple alors....
un
deux
trois
<script type="text/javascript">
function affiche(sel)
{
var n=1;
while ( document.getElementById("d"+n) )
{
document.getElementById("d"+n).style.visibility="hidden";
n++;
}
document.getElementById("d"+(sel.selectedIndex+1)).style.visibility="visible";
}
</script>
<form>
<select name="category" style="width:200px"
onchange="affiche(this);"
onfocus="this.selectedIndex=-1);">
<optgroup label="-CATEGORY-">
<option>un</option>
<option>deux</option>
<option>trois</option>
</optgroup>
</select>
</form>
remarques : un id doit commencer par une lettre.
on commence par cacher tous les div id="d#"
on affiche celui correspondant au n° de ligne sélectionné
( on aurait pu utiliser le .value, mais bof ... )
j'aime bien les <optgroup>
si le select n'a pas de size, ou s'il est =1,
la 1ère ligne est sélectionnées par défaut
( d'où la séselection au focus )
on pouvait utiliser style.display="none" ou "inline"
à adapter à ce qu'il faut.
<hr />
Cordialement Bul [mon Site] [M'écrire]
<hr />
Vous n'êtes pas encore membre ?
inscrivez-vous, c'est gratuit et ça prend moins d'une minute !
Les membres obtiennent plus de réponses que les utilisateurs anonymes.
Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.
Le fait d'être membre vous permet d'avoir des options supplémentaires.