Div visible ou hidden / Display none

Version imprimable

Bonjour

Ca fait 3 jours que je cherche et que je change mon code pour faire une chose tr�s simple qui est, un div visible ou non

Code:

1
2
3
4
5
6
7
8
9
10
11
12
 
<div align="center">
              <select name="occ">
                <option onClick="document.getElementById('occautre').style.display=none;"value="">Choisir</option>
                <option value="Occupation simple"  onClick="document.getElementById('occautre').style.display=none;">Occupation simple</option>
                <option value="Occupation double" onClick="document.getElementById('occautre').style.display=none;">Occupation double</option>
                <option value="Occupation double avec enfant" onClick="document.getElementById('occautre').style.display=none;">Occupation double avec enfant</option>
                <option value="Autre" onClick="document.getElementById('occautre').style.display='';">Autre</option>
              </select>
              <div id="occautre" style="display:none" >Précisez
                <input type="text" name="occo" id="occo">
              </div>

Comme vous pouvez remarquer que mon code est tr�s simple...

Le probl�me est que sur FF tout fonctionne mais sur IE6, IE7 et Safari(windows version) le div ne bouge pas

avez vous une id�e, sauf la corde bien sur!!!
:aie:

15/08/2008, 03h35
Sub0

Salut! ;)

Voici toutes les valeurs que peut prendre cette propri�t� :
http://msdn.microsoft.com/en-us/library/ms530751.aspx
15/08/2008, 08h47
Bovino

Code:

document.getElementById('un_id').style.display='none'

Tu as oubli� les '
15/08/2008, 09h53
Sub0

Bonjour Bovino ! ;)

Pendant que j'y pense, j'ai un conseil pour HWICE :

Si tu ne connais pas encore, il existe un outil tr�s pratique pour la mise au point du code JavaScript, c'est la console d'erreurs de FireFox. Elle se trouve dans le menu Outils du navigateur...

Un autre conseil : Utilise un �diteur avec coloration syntaxique si ce n'est pas d�j� le cas.

A+
15/08/2008, 12h37
Auteur

IE (et visiblement Safari) ne prend pas en charge l'�v�nement onclick sur les balises <option>. G�re l'�v�nement onchange sur la balise <select>

J'utilise deja Firebug et mon code est fait dans dreamweaver CS3
Code:

1 2 3 <option value="Occupation double avec enfant" onClick="document.getElementById('occautre').style.display='none';" onchange="document.getElementById('occautre').style.display='none';">Occupation double avec enfant</option> <option value="Autre" onClick="document.getElementById('occautre').style.display='';" onchange="document.getElementById('occautre').style.display='';">Autre</option>
Ne fonctionne tjs pas. Je veux juste faire apparaitre un champ texte quand l'utilisateur selectionne Autre

15/08/2008, 15h36
Auteur

je me r�p�te :mrgreen: :

Citation:

Envoy� par Auteur

IE (et visiblement Safari) ne prend pas en charge l'�v�nement onclick sur les balises <option>. G�re l'�v�nement onchange sur la balise <select>

Bovino & Auteur ont raison.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<script type="text/javascript">
  function test_value(val){
    var el=document.getElementById('occautre');
    if(val=='Autre') el.style.display='block';else el.style.display='none';
  }
</script>
 
<div align="center">
  <select name="occ" onchange="test_value(this.value);">
    <option value="">Choisir</option>
    <option value="Occupation simple">Occupation simple</option>
    <option value="Occupation double">Occupation double</option>
    <option value="Occupation double avec enfant">Occupation double avec enfant</option>
    <option value="Autre">Autre</option>
  </select>
  <div id="occautre" style="display:none;">Précisez
    <input type="text" name="occo" id="occo"/>
  </div>
</div>

J'ai oubli� une chose...
Si Javascript est d�sactiv�, le champs de saisie n'appara�tra jamais.
Je te conseille plut�t d'utiliser ce code :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<div align="center">
  <select name="occ" onchange="test_value(this.value);">
    <option value="">Choisir</option>
    <option value="Occupation simple">Occupation simple</option>
    <option value="Occupation double">Occupation double</option>
    <option value="Occupation double avec enfant">Occupation double avec enfant</option>
    <option value="Autre">Autre</option>
  </select>
  <div id="occautre">Précisez
    <input type="text" name="occo" id="occo"/>
  </div>
</div>
<script type="text/javascript">
  var el=document.getElementById('occautre');
  function test_value(val){
    if(val=='Autre') el.style.display='block';else el.style.display='none';
  }
  el.style.display='none';
</script>

C�t� serveur, tu r�cup�res l'option s�lectionn�e et si il s'agit de "Autre", tu prends en compte la saisie de l'utilisateur.

15/08/2008, 16h47
HWICE

G�nial merci bcp Sub0