Hola a todos:
He creado una funcion que le aplica una clase determinada a las opciones de un select. He comprobado que la clase se va cambiando bien... y en el momento de desplegar el combo veo que todo va bien. Ahora es cuando viene el problema, si cambio de nuevo la clase veo como la opcion seleccionada cambia efectivamente de clase pero si vuelvo a desplegar las opciones salen como la primera vez que desplegue, como si se hubiera quedado cogida ese estilo a la primera vez que se despliega y ya no vuelve a cambiar.
Aqui teneis un ejemplo de lo que pasa, lo podeis probar rapido, es el codigo html completo:
Código:
<html>
<head>
<script language="javascript">
function rellena_combo(color) {
for(i=0;i<4;i++){
document.formulario.menu.options[i].className=color;
}
}
</script>
<style type="text/css">
<!--
.rojo {
color: #FF0000;
}
.verde {
color: #006600;
}
-->
</style>
</head>
<body>
<p><a href="javascript:rellena_combo('rojo')">rojo</a></p>
<p><a href="javascript:rellena_combo('verde')">verde</a></p>
<form id="formulario" name="formulario" method="post" action="">
<select name="menu">
<option value="uno" class="rojo">uno</option>
<option value="dos" class="rojo">dos</option>
<option value="tres" class="rojo">tres</option>
<option value="cuatro" class="rojo">cuatro</option>
</select>
</form>
</body>
</html>
Inicialmente el combo es rojo, si desplegais y despues pulsais 'verde' vereis que la opcion seleccionada esta a verde pero si despliegas veras que todas estan a rojo.
Si al cargar la pagina pulsas 'verde' y luego despliegas veras que todo esta verde, si pulsas 'rojo' aparece el efecto contrario a lo que he explicado.
Puede ser un error del navegador?
Hay alguna solucion a esto?
Gracias