A ver, vamos por partes.
Lo que te decía con respecto a los estilos (CSS), es que desde una hoja de estilos, ocultes a ambos
<div>
mediante la propiedad
display
, asignándole el valor
none
, luego, en la misma hoja de estilos, crea una clase que tendrá como única propiedad a
display
pero con el valor
block
, de esta manera, cuando selecciones una opción del
<select>
, tomas al
<div>
que corresponda y le aplicas dicha clase, además, buscas al
<div>
que ya posea dicha clase, es decir, al que haya sido seleccionado previamente.
Como añadido, la primera opción, que es la que no tiene valor, al ser seleccionada, debe de ocultar al
<div>
que sea visible en ese momento, por lo que el script sería así:
Código Javascript
:
Ver original//La variable en la que guardaré al elemento que posea la clase 'visible'
var visible;
//Ejecuto una función cuando elija una opción del <select>
document.querySelector("#elige").addEventListener("change", function(){
//Tomo al <div> que posea la clase 'visible'
visible = document.querySelector(".visible");
//Si el valor de la opción seleccionada contiene uno o más caracteres
if (this.value.length){
//Verifico si hay al menos un <div> con la clase 'visible'
if (visible.length){
//De haberlo, le quito dicha clase
visible.className = "";
}
//Luego, tomo al <div> cuyo id corresponda con el de la opción seleccionada y le asigno la clase 'visible'
document.querySelector("#" + this.value).className = "visible";
}
//Si el valor de la opción seleccionada no contiene caracteres (está vacía)
else{
//Verifico si hay al menos un <div> con la clase 'visible'
if (visible.length){
//De haberlo, le quito dicha clase
visible.className = "";
}
}
}, false);
Y, por favor, cuando muestres código, utiliza el
highlight que corresponda, así será más fácil leer tu código. Puedes seleccionarlo desde el
<select>
que aparece justo arriba del área de texto en el que escribes tus respuestas.
No te olvides de asignar los
id
de los
<div>
a las dos últimas opciones del
<select>
, tal y como te lo expliqué en mi respuesta anterior.
Saludos