begin process at 2012 05 29 23:58:37
  Trouver un code source :
 
dans
 
Accueil > Forum > 

Javascript / DHTML / Ajax

 > 

CSS

 > 

Général

 > 

Selection une option Afficher/masquer des div !


Derniers messages déposésPoser une question dans le forum ou lancer une discussion

Selection une option Afficher/masquer des div !

lundi 27 août 2007 à 11:45:34 | Selection une option Afficher/masquer des div !

younes371

Bonjour,
j ai une liste (select) avec deux options, ce que je veux faire :
lorsque je selectionne une option j affiche un div (contient les informations de cette option) et je masque un autre div (qui les informations  du 2eme option).
j ai fait ce script :

<script langage="JavaScript">

function aDuree(thingId,thingId2)

{

var targetElement; var targetElement2;

targetElement = document.getElementById(thingId) ;

targetElement.style.display = "" ;

targetElement2 = document.getElementById(thingId2) ;

targetElement2.style.display = "none" ;

}

</script>

et dans le code html

<select id="duree" name="duree">

<option value="d" onSelect="javascript:aDuree('Div7','Div8');">Saisir dur&eacute;e</option>

<option value="df" onSelect="javascript:aDuree('Div8','Div7');">Saisir D&eacute;but / Fin</option>

</select>

mais ça ne marche pas , pouvez vous m aider, merci.


N'importe où. 
mais là où il le faut.

lundi 27 août 2007 à 11:47:14 | Re : Selection une option Afficher/masquer des div !

younes371

j ai oublié à ajouté :
aussi dans le code html
<div id="Div7">infos option 1</div>
<div id="Div8">infos option 2</div>

Merci pour vos aides

N'importe où. 
mais là où il le faut.

lundi 27 août 2007 à 12:19:24 | Re : Selection une option Afficher/masquer des div !

bultez

Membre Club
Réponse acceptée !





bonjour,

   onselect ? pas permis sur un select, si ?
   pas d'évènements sur option ( enfin, pour IE, avec FF ça baignerait )
         il faut mettre sur la balise select....


<script type="text/JavaScript">
function appel(sel)
{ switch (sel.selectedIndex)
  { case 0:
      aDuree('Div7','Div8');
      break;
   case 1:
      aDuree('Div8','Div7');
      break;  
  }
}

function aDuree(thingId,thingId2)
{ document.getElementById(thingId).style.display = "" ;
  document.getElementById(thingId2).style.display = "none" ;
}

</script>

<select id="duree" name="duree"
   onchange="appel(this);">

<option value="d">Saisir dur&eacute;e</option>
<option value="df">Saisir D&eacute;but / Fin</option>
</select>

<div id="Div7">infos option 1</div>
<div id="Div8" style="display:none">infos option 2</div>


largement améliorable, mais j'ai voulu "conserver l'origine".

remarques sur select : s'il ne possède pas de size ( ou si ce
   size=1 ), la 1ère ligne est sélectionnée par défaut,
   c'est pour ça que j'ai ajouté display:none sur Div8.
   ( on peut aussi, faire autrement, style 
      onfocus=this.selectedIndex=-1; )


            Cordialement          Bul       [mon Site]    [M'écrire]
                                    En général, c'est absurde de généraliser.
lundi 27 août 2007 à 12:21:41 | Re : Selection une option Afficher/masquer des div !

bultez

Membre Club
au fait...
<option value="d">Saisir durée</option>
<option value="df">Saisir Début / Fin</option>
ça baigne aussi.

                        Cordialement       Bul       [mon Site]    [M'écrire]
                                                            En général, c'est absurde de généraliser.
lundi 27 août 2007 à 13:36:57 | Re : Selection une option Afficher/masquer des div !

younes371

Merci bcp pour ta reponse !

Stp, si je veux faire comme cela :

<select id="duree" name="duree"
   onchange="appel(this);">

<option value="0">Selectionner une option</option>
<option value="d">Saisir duree</option>
<option value="df">Saisir Debut / Fin</option>
</select>

lors de la selection de l option = 0, les deux Divs se masquent ?
Merci encore une fois

N'importe où. 
mais là où il le faut.

lundi 27 août 2007 à 13:44:26 | Re : Selection une option Afficher/masquer des div !

bultez

Membre Club
>>les deux Divs se masquent ?
    c'est une affirmation ou c'est ce que tu voudrais faire ?
dans la function appel, on teste qu'elle ligne a été choisie.
     ...
switch (sel.selectedIndex)...                 fais-y ce que tu veux.

Cordialement                Bul         [mon Site]     [M'écrire]
En général, c'est absurde de généraliser.
lundi 27 août 2007 à 16:16:44 | Re : Selection une option Afficher/masquer des div !

younes371

Normalement,
c ce que je veux faire,
mais comment masquer DIV7 et DIV 8 en meme temps si je selectionne "selectionnez une option" ?
merci

N'importe où. 
mais là où il le faut.

lundi 27 août 2007 à 17:21:29 | Re : Selection une option Afficher/masquer des div !

younes371

Bon j ai fais une solution un peu banal mais ça fonctionne :
<script type="text/JavaScript">
function appel(sel)
{ switch (sel.selectedIndex)
  { 
case 0:
      aDuree('Div7','Div8');
      break;
case 1:
      aDuree('Div7','Div8');
      break;
   case 2:
      aDuree('Div8','Div7');
      break;  
  }
}

function aDuree(thingId,thingId2)
{ document.getElementById(thingId).style.display = "" ;
  document.getElementById(thingId2).style.display = "none" ;
}

function aDuree1(thingId,thingId2)
{ document.getElementById(thingId).style.display = "none" ;
  document.getElementById(thingId2).style.display = "none" ;
}

N'importe où. 
mais là où il le faut.

lundi 27 août 2007 à 17:23:33 | Re : Selection une option Afficher/masquer des div !

younes371

correction :
 
case 0:
      aDuree1('Div7','Div8');
      break;


N'importe où. 
mais là où il le faut.

lundi 27 août 2007 à 18:20:19 | Re : Selection une option Afficher/masquer des div !

bultez

Membre Club




>>
case 0:
      aDuree1('Div7','Div8');
      break;

par exemple, ou directement ?

case 0:
 
document.getElementById('Div7').style.display = "none" ;
  document.getElementById('Div8').style.display = "none" ;
  break;


Cordialement                Bul         [mon Site]     [M'écrire]
En général, c'est absurde de généraliser.

1 2

Cette discussion est classée dans : selection, option, div, targetelement, targetelement2


Répondre à ce message

Sujets en rapport avec ce message

charger image dans un DIV [ par putch ] salut à tous !voila mon soucij'ai une liste deroulante contenant des noms d'imagesje souhaiterai que lorsque l'on selectionne un element cela affiche Masquer/Afficher Div [ par dommm063 ] Bonjour,J'aimerais créer une page où le conetenu n'est pas affiché au chargement, et où il faut cliquer sur les titres pour dérouler le contenu.J'ai d <SELECT> : selection automatique [ par chour03 ] Bonjour.J'aimerais savoir comment il serait possible de selectionner de façon automatique au chargement de la page une option dans un select... Le cho Position d'une selection dans un div editable [ par fefefefef ] Bonjour, je cherche a obtenir la position d'une sélection d'un texte placé dans un div que l'on peut modifier à l'aide de l'attribut contentEditable. Afficher/masquer DIV: reste en dessous du scroll => pas visible de suite [ par Delphine38 ] Bonjour à tous, J'ai pourtant cherché et tester pas mal de chose mais rien de marche. J'ai une image + textes dans des DIV, eux-même dans un DIV que JQUERY ma div reste collé a ma sourie [ par arcuce ] Bonjour, j'ai un problème plutôt énervant, je viens de me remettre au java-script et surtout a l'utilisation de JQUERY j'ai entrepris de faire un pet Perte de Focus [ par fazerofgod ] Bonjour, Je suis en train de faire quelques tests et il se trouve que j'ai un petit souçis... En gros j'ai un évènement "MouseOver" qui me lance une a Javascript : simuler un OnBlur sur Div [ par patsherbrooke ] J'ai conçu une combo box en javascript à l'aide de div pour l'input box et la liste déroulante. Mon problème est de simuler un Onblur sur une div afin div qui suit le scrolling de la page => PETOLETEAM [ par torg33 ] Bonjour tout le monde, je viens d'intégrer le script de PetoleTeam à mon portfolio et je tiens a dire que c'est tout à fait ce qu'il me faut. Mais (et Griser une liste déroulante en fontion d'une autre [ par stealone ] Bonjour, j'ai une fonction javascript qui ne fonctionne pas bien. j'ai six listes déroulantes regroupées en deux dans tris balises ...; je souhaite q


Nos sponsors


Sondage...

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

Photothèque

A découvrir



 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 1,373 sec (3)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales