Mi código funciona en IE, pero en Mozilla Firefox no!

[Super Mario]

Hola!

Estoy trabajando en VS.NET (con XHTML y CSS). Tengo esta porción de código, el cual se trata de un botón (INPUT), que al presionarlo, ejecuta un javascript que muestra un componente DIV, el cual se encuentra oculto (por medio de su propiedad 'display'). El código es:

<INPUT onclick="OnClick()" type="button" value="Presiona aqui" runat="server" ID="Button1" NAME="Button1">

<div id="div1" style="display: none">
HOLA
</div>

<SCRIPT language="javascript">
function OnClick()
{
if (div1.style.display == "none")
div1.style.display = "";
else
div1.style.display = "none";
}
</SCRIPT>

El código funciona perfectamente en Internet Explorer 6.0 . Sin embargo, al probarlo con Mozilla Firefox 0.9.2, simplemente no funciona, y la consola de JavaScript de Firefox me muestra el siguiente error:

"Error: div1 is not defined"

Para no hacer esto tan confuso para ustedes, pongo el siguiente link para que prueben el código que he mostrado en la parte superior:

http://trejosystems.no-ip.com/intran...on/prueba.aspx

Y pongo este otro para que vean el código completo:

http://trejosystems.no-ip.com/intran...ds/codigo.aspx

Ojala alguien pudiese ayudarme.

[ PD: Disculpen si coloqué mi pregunta en el foro equivocado. Tal vez era en el de JavaScript ]

Gracias!

[KnowDemon]

La forma en que IE y Gecko manejan el DOM es algo diferente. Gecko No puede encontrar el elemento de esa manera...

Puedes utilizar la siguiente sintaxis:

En vez de usar:

div1.style.display

Usa:

document.getElementById("div1").style.display

La función getElementById() devuelve a Javascript el elemento que tenga la id mandada como parámetro.

[Super Mario]

Excelente KnowDemon!!!!

Si funcionó tanto en IE como en Mozilla Firefox.

Muchas gracias!!!!!

[diex00]

Yo tengo exactamente el mismo problema pero la solucion no solo no me vale, si no que ademas me deja de funcionar en IE...
Os dejo el codigo, quiza alguien pueda ayudarme

Código:

<a onMouseOver="Mostrar(Erik)" onMouseOut="Mostrar(Erik)">Erik Getters</a>

<div id="Erik" style="display:none;">
<b>Name</b>: Erik Getters
<b>Nationality</b>: English
<b>Position</b>: Goalkepper</div>

<script language="JavaScript">
function Mostrar(Div){
   if (document.getElementById("Div").style.display == "none"){
   document.getElementById("Div").style.display = ""
   }
   else{
   document.getElementById("Div").style.display = "none"
   }
}
</script>

Si sustituyo document.getElementById("Div").style.display por simplemente Div.style.display, entonces funciona en IE pero no en Mozilla

Gracias

[daPhyre]

Por favor no revivas temas antiguos.

En cuanto a tu pregunta, el elemento que busas por Id es "Erick", no "Div". Prueba con ello.

Por cierto, la forma correcta es usar "block" donde dejas las comillas vacías.