AYUDA me funciona en Mozilla pero no en Explorer 8

gglenda122 · #1 (**permalink**) 06/03/2011, 20:52

Hola comunidad:

Tengo un script que me funciona perfectamente bien en Mozilla les explico: cuando le doy click a una lista/menu donde me sale una serie de opciones pero especificamente le doy click a Cursos me aparece otro lista/menu donde me sale la lista de los diferentes cursos, y si le doy a otra opcion se oculta la lista/menu que es lo que quiero esto funciona PERFECTAMENTE en Mozilla pero no me funciona en Explorer 8, la idea es que me funcione bien en cualquier navegador para que el usuario no tenga que apretar un boton adicional. Que puedo hacer?

maycolalvarez · #2 (**permalink**) 06/03/2011, 22:03

no todos los navegadores cargan el DOM de la misma forma, por lo que veo tienes un bloque de script al final que lógicamente se ejecutaría al final de que el DOM estuviese cargado y funcionaria perfecto, en este caso con FF, pero eso no quiere decir que IE otros navegadores lo hagan igual.

la solución es verificar si el DOM está completamente cargado antes de llamar a ese bloque, una opción rápida y sin complicaciones sería anidarlo dentro de una función y llamarla en el onload del body:

Código Javascript:

Ver original<script type="text/javascript">
 
function aparecerCursos(b)
{
     cCursos=document.getElementById("cursos");
     if(b) { cCursos.style.visibility="visible"; } else { cCursos.style.visibility="hidden"; }
}
</script>

<body onload="aparecerCursos(false);">...

Panino5001 · #3 (**permalink**) 06/03/2011, 22:11

Mmm... Hasta donde recuerdo Explorer no soporta onclick en el tag option por lo que hay que usar onchange en el elemento select.

Código PHP:

  <!--esto no funciona en explorer: -->
<form id="form1" name="form1" method="post" action="">
    <select name="pp" id="pp">
      <option onclick="alert(1)" value="1">uno</option>
      <option onclick="alert(2)" value="2">dos</option>
 </select>
</form>
<!--esto funciona en todos los navegadores: -->
<form id="form2" name="form2" method="post" action="">
    <select name="select" id="select" onchange="alert(this.selectedIndex)">
       <option value="1">uno</option>
      <option  value="2">dos</option>
    </select>
</form>

gglenda122 · #4 (**permalink**) 08/03/2011, 03:45

Cita:

Iniciado por Panino5001

Mmm... Hasta donde recuerdo Explorer no soporta onclick en el tag option por lo que hay que usar onchange en el elemento select.

Código PHP:

  <!--esto no funciona en explorer: --> 
<form id="form1" name="form1" method="post" action=""> 
    <select name="pp" id="pp"> 
      <option onclick="alert(1)" value="1">uno</option> 
      <option onclick="alert(2)" value="2">dos</option> 
 </select> 
</form> 
<!--esto funciona en todos los navegadores: --> 
<form id="form2" name="form2" method="post" action=""> 
    <select name="select" id="select" onchange="alert(this.selectedIndex)"> 
       <option value="1">uno</option> 
      <option  value="2">dos</option> 
    </select> 
</form>

gglenda122 · #5 (**permalink**) 08/03/2011, 03:48

Gracias por responder, pero ya habia intentado con onchance y tampoco funciona

gglenda122 · #6 (**permalink**) 08/03/2011, 05:39

Cita:

Iniciado por maycolalvarez

no todos los navegadores cargan el DOM de la misma forma, por lo que veo tienes un bloque de script al final que lógicamente se ejecutaría al final de que el DOM estuviese cargado y funcionaria perfecto, en este caso con FF, pero eso no quiere decir que IE otros navegadores lo hagan igual.

la solución es verificar si el DOM está completamente cargado antes de llamar a ese bloque, una opción rápida y sin complicaciones sería anidarlo dentro de una función y llamarla en el onload del body:

Código Javascript:

Ver original<script type="text/javascript">
 
function aparecerCursos(b)
{
     cCursos=document.getElementById("cursos");
     if(b) { cCursos.style.visibility="visible"; } else { cCursos.style.visibility="hidden"; }
}
</script>

<body onload="aparecerCursos(false);">...

La verdad no soy muy ducha en esto hice algunos cambios y me indica un mensaje que no se admite la etiqueta body en el atributo body, ademas me desaparece la lista /menu de cursos, computgacion etc...y me sale las opciones pero como texto:

<script>
function aparecerCursos(b)
{
if(b) { cCursos.style.visibility="visible"; } else { cCursos.style.visibility="hidden"; }
}
</script>

<body onload="combo" size="1" id="combo">

<body onload="aparecerCursos(false)">Computación</body>
<body onload="aparecerCursos(false)">Software</body>
<body onload="aparecerCursos(false)">Reparación</body>
<body onload="aparecerCursos(true)">Cursos;</body>
<body onload="aparecerCursos(false)">Películas y/o Videos</body>
<body onload="aparecerCursos(false)">Juegos</body>
<body onload="aparecerCursos(false)">Otros</body>

<select id="cursos" name="cursos" size="1" >
<option>Excel Básico</option>
</select>

<script type="text/javascript">

function aparecerCursos(b)
{
cCursos=document.getElementById("cursos");
if(b) { cCursos.style.visibility="visible"; } else { cCursos.style.visibility="hidden"; }
}
</script>

Panino5001 · #7 (**permalink**) 08/03/2011, 07:36

Código PHP:

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Documento sin título</title> 
</head> 
 
<body> 
<script> 
function aparecerCursos(b) 
{ 
    var cCursos=document.getElementById("cursos"); 
 
if(b) { cCursos.style.visibility="visible"; } else { cCursos.style.visibility="hidden"; } 
} 
</script> 
 
 
<select name="combo" size="1" id="combo" onchange="aparecerCursos(this.options[this.selectedIndex].innerHTML=='Cursos')"> 
<option selected="selected">Computaci&oacute;n</option> 
<option>Software</option> 
<option>Reparaci&oacute;n</option> 
<option>Cursos</option> 
<option>Pel&iacute;culas y/o Videos</option> 
<option>Juegos</option> 
<option>Otros</option> 
</select> 
 
 
 
<select id="cursos" name="cursos" size="1" > 
<option>Excel B&aacute;sico</option> 
</select> 
 
<script> 
aparecerCursos(document.getElementById("combo").options[document.getElementById("combo").selectedIndex].innerHTML=='Cursos'); 
</script> 
</body> 
</html>

PD: tu último código tiene errores por todos lados: ni el html se salvó!

IsaBelM · #8 (**permalink**) 08/03/2011, 07:38

a esto es a lo que se refiere panino

. el indice de la opción con la que se mostrará el otro combo es 3 ya que el indice empieza en 0

Cita: