Javascript : document.getElementById()

[Antoine.B]

Salut les Wrinautes

j'ai un petit soucis d'incompatibilité Firefox/Internet explorer sur le code suivant :

<script type="text/javascript">


	function select_type_indiv()
	{
	    document.getElementById(2).style.display = "block";
	    document.getElementById(1).style.display = "none";
	}

	function select_type_pro()
	{
	    document.getElementById(1).style.display = "block";
	 	document.getElementById(2).style.display = "none";
	}

	function select_type_vide()
	{
	    document.getElementById(2).style.display = "none";
	    document.getElementById(1).style.display = "none";
	 
	}

</script>

<select>              

       <option onclick="select_type_vide()" value="choose"> Select... </option>

       <option  onclick="select_type_indiv()" value="indiv">individual </option>

       <option  onclick="select_type_pro()" value="pro"> professional </option>   

</select>


<div id="1" style="display:none;">Contenu du div pro ....</div>
<div id="2" style="display:none;">Contenu du div individual ...</div>

sous Firefox, tout ce passe comme il faut, si rien est selectionné dans le menu déroulant, rien n'apparait, si "professional" est sélectionné, le div 1 apparait, et enfin si "individual" est sélectionné, le div 2 apparait.

ça ne marche malheureusement pas sous ie6 et 7, quelqu'un sait de quoi ça viens ?


merci infiniment

 

[UsagiYojimbo]

Et en mettant tes id entre "" quand tu les appelles via la fonction getElementById ?

ex :
document.getElementById("2").style.display = "block";

 

[Antoine.B]

eh bien non s'eut été trop beau !

j'ai meme essayé juste ça :

       <option  onclick="alert('test');" value="pro"> professional </option>

Firefox m'affiche une alerte alors que ie reste planté là stoique sans rien faire...

erf :?

 

[dh]

<select name="uu" size="1" onclick=alert(this.value);>
<option value="pro"> professional </option>
<option value="5"> 5</option>
</select>


ok ie et ff onchange plutot que onclick serait plus souple d'utilisation
dh

 

[Antoine.B]

<script type="text/javascript">


   function select_type_indiv()
   {
       document.getElementById(2).style.display = "block";
       document.getElementById(1).style.display = "none";
   }

   function select_type_pro()
   {
       document.getElementById(1).style.display = "block";
       document.getElementById(2).style.display = "none";
   }

   function select_type_vide()
   {
       document.getElementById(2).style.display = "none";
       document.getElementById(1).style.display = "none";
   
   }

    function affiche(value)
    {

	if (value=='choose')
	{
		 select_type_vide()
	}
	else if(value=='indiv')
	{
		  select_type_indiv()
	}
	else if(value=='pro')
	{
		  select_type_pro()
	}

    }

</script>

<select onchange="affiche(this.value);">             

       <option  value="choose"> Select... </option>

       <option  value="indiv">individual </option>

       <option  value="pro"> professional </option>   

</select>


<div id="1" style="display:none;">Contenu du div pro ....</div>
<div id="2" style="display:none;">Contenu du div individual ...</div>

Comme ça ça marche
un grand merci !
@++