JavaScript y un blog. Consulta sencilla

Ante todo: No tengo ni idea de Javascript ni por desgracia tiempo para estudiarlo (aunque me gustaria)

He visto alguna pagina que permite ir construyendo menus y luego te genera el codigo necesario simplemente para pegarlo en la web.

Por ejemplo esta http://javascript.internet.com/generato ... -menu.html

He creado algun menu desplegable muy sencillo, como este

<BODY><div id=EchoTopic>

<!-- Original:  Ricocheting (ricocheting@hotmail.com)  -->
<!-- Web Site:  http://free.prohosting.com/~ric  -->

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->

<form name="jump">
<select name="menu" onChange="location=document.jump.menu.options[document.jump.menu.selectedIndex].value;" value="GO">
<option value="http://www.elotrolado.net">Opcion 1</option>
<option value="http://www.elotrolado.net">Opcion 2</option>
<option value="http://www.elotrolado.net">Opcion 3</option>
</select>
</form>



Pero tengo 2 problemas a la hora de insertarlo en la columna de mi blog.

El primero es que la primera opcion de las 3 no sirve; es decir, pinchas pero no dirige al link. Eso me da igual, es tan facil como darle de valor "Escoge una opcion", y asi sirve de titulo al menu , para que la gente lo despliegue.

El problema verdadero es que cuando pongo 2 menus seguidos, es decir, si pongo 2 "widgets" en el blog cada uno con el mismo codigo pero diferentes enlaces, los menus dejan de funcionar.

Es decir, solo funcionan si son el unico "widget de menu desplegable" de la columna.

¿Es esto normal?
Si es normal que no funcione si le pones el mismo nombre a dos componentes dentro del mismo formulario, ya que no sabría cual de los dos le ha llamado xD, en cuanto al primer enlace creo que también ya que estas usando onChange prueba con onClick (creo que era así) aunque creo que este no es para el select.
Para tener otro menú creo que solo hace falta cambiar de nombre al select y al script que le llama ejemplo:
<select name="menu_1" onChange="location=document.jump.menu_1.options[document.jump.menu_1.selectedIndex].value;" value="GO">
<option value="http://www.elotrolado.net">Opcion 1</option>
<option value="http://www.elotrolado.net">Opcion 2</option>
<option value="http://www.elotrolado.net">Opcion 3</option>
</select>
El otro menú
<select name="menu_2" onChange="location=document.jump.menu_2.options[document.jump.menu_2.selectedIndex].value;" value="GO">
<option value="http://www.elotrolado.net">Opcion 4</option>
<option value="http://www.elotrolado.net">Opcion 5</option>
<option value="http://www.elotrolado.net">Opcion 6</option>
</select>

(mensaje borrado)
La primera opción no te funciona porque en realidad no está provocando un evento de cambio de selección, dado que está seleccionada inicialmente (es decir, para que te funcione tienes que provocar la selección de este elemento). El evento onClick tendrías que definirlo dentro de cada elemento, sino hace referencia al objeto lista y no a sus elementos.

Tienes varias opciones para solucionarlo: o creas un nuevo elemento que no redirija a ningún sitio (algo del estilo "Seleccione", o "Elija opción"), de forma que obligas al usuario a escoger una opción de las que si provocarán el evento de cambio; también puedes definir un evento onClick para cada elemento de la lista, o poner al lado un botón que haga el envío de valores (en este caso, el botón encapsula la funcionalidad de redirección asignada a la lista).

También puedes no usar Javascript ;)
3 respuestas