No es necesario el uso de
eval
, menos de esa forma pues, si un usuario editara el valor del combo desde el panel de herramientas de desarrollo, terminaría ejecutándose un posible código malicioso. Por otro lado, para el mostrado y ocultamiento de los elementos con JavaScript, se me ocurre una solución más práctica:
Código Javascript
:
Ver originalvar divs = document.getElementsByTagName("div"),
total = divs.length;
function mostrar(id) {
for (var i = 0; i < total; i++){
divs[i].className = divs[i].id == id ? "visible" : "invisible";
}
}
Esta parte es sencilla. Tomo a los elementos
<div>
y a la función le paso el valor seleccionado en el combo, el cual debe de ser uno de los
id
de los elementos
<div>
. En la función, recorro al conjunto de elementos
<div>
y, en cada iteración, comparo el
id
de cada uno de ellos con el valor recibido; si coinciden, cambio el nombre de la clase del elemento
<div>
actual por 'visible', caso contrario, por 'invisible'. Para esto, tu combo tendrá que tener esta forma:
Como verás, solo cambié los valores de las opciones por los
id
de los elementos
<div>
y, en la llamada a la función, envío el valor seleccionado en el combo. La ventaja de hacerlo de esta manera es que, aunque tengas más o menos elementos
<div>
, no tendrás que aumentar o disminuir código en la función, siempre funcionará.
Saludos