Select con varios option y distintos enlaces a paginas

core_2duo · #1 (**permalink**) 12/08/2007, 11:06

tengo un select con varios option y quiero que cuando el usuario elija una de esas option y pulse un boton se vaya a la pagina correspondiente para la option que ha elegido. Como se puede hacer eso?

Atomycko · #2 (**permalink**) 13/08/2007, 11:57

Saludos core_2duo!!

Espero esto te sirva

Con Boton:

Código HTML:

<html>
<head>

<script LANGUAGE="JavaScript">
function abreSitio(){
var URL = "http://";
var web = document.form1.sitio.options[document.form1.sitio.selectedIndex].value;
window.open(URL+web, '_blank', '');
}
</script>

</head>
<body>

<form name="form1" target="_blank">
<select name="sitio">
<option>» Selecciona «</option>
<option value="www.google.com">Google</option>
<option value="www.yahoo.com">Yahoo</option>
<option value="www.hotmail.com">Hotmail</option>
</select>
<input type="button" value="Ir" onClick="javascript:abreSitio()">
</form>

</body>
</html>

Sin Boton:

Código HTML:

<html>
<head>

<script LANGUAGE="JavaScript">
function abreSitio(){
var URL = "http://";
var web = document.form1.sitio.options[document.form1.sitio.selectedIndex].value;
window.open(URL+web, '_blank', '');
}
</script>

</head>
<body>

<form name="form1" target="_blank">
<select name="sitio" onChange="javascript:abreSitio()">
<option>» Selecciona «</option>
<option value="www.google.com">Google</option>
<option value="www.yahoo.com">Yahoo</option>
<option value="www.hotmail.com">Hotmail</option>
</select>
</form>

</body>
</html>

Si quieres que muestre la pagina en la misma ventana, quita el _blank de "window.open"

core_2duo · #3 (**permalink**) 16/08/2007, 04:01

El problema que tengo con la solución que me das es que donde tu pones en el campo value la url de la pagina yo ya tengo puesto la url a una imagen que tambien quiero que muestre en la pagina actual segun se vaya moviendo entre las opciones (options) y entonces no se ya como indicarle la url del enlace

jaco18 · #4 (**permalink**) 25/08/2007, 20:50

esta exelente la informacion Atomycko pero tengo una duda a ver si me la puedes responder aqui........ si el enlace lo quiero abrir en un iframe que esta en al misma pagina como le hago????

de antemano muchas gracias por el codigo.............

derkenuke · #5 (**permalink**) 25/08/2007, 21:15

Hola core_2duo, Atomycko y jaco18.

Para solventar el problema de que ya tenemos ocupados los value de los option, se me ocurre que podemos utilizar cualquier otro atributo que no se llame value para almacenar la URL de destino y luego utilizarla en el script (se utilizará totalmente igual, o si se prefiere con getAttribute()).

@jaco18: Si lo que tienes es un iframe en vez de window.open() tendrás que utilizar algo como window.frames["nombreIframe"].location.href="http://www.pagina.com"; es como redireccionar el window normal, sólo que hay que acceder al elemento iframe en cuestión.

Un saludo a todos.

jaco18 · #6 (**permalink**) 25/08/2007, 21:51

hola derkenuke muchisimas gracias por responder hice lo ke me dijiste (utilizar algo como window.frames["nombreIframe"].location.href="[/url]"; es como redireccionar el window normal, sólo que hay que acceder al elemento iframe en cuestión) lo

el problema esta en que que el select me carga mi pagina.com la misma pagina para las tres opciones del ejemplo la de yahoo, google y hotmail entonces me interesa que en ese iframe se cangue el selec que se elija........

derkenuke · #7 (**permalink**) 25/08/2007, 22:00

¿Estás seguro de que en el código has puesto algo como esto?

Código PHP:

  window.frames["nombreIframe"].location.href = elSelect.value;

Siempre y cuando las direcciones a las que hay que redireccionar estén en los value de los option del select.

Un saludo.

jaco18 · #8 (**permalink**) 25/08/2007, 22:10

gracias por responder pronto estoy intentandolo lo que pasa es que soy nuevo en esto de java pero si me interesa mucho aprender a hacer el select...

no entinedo mucho de esto pero hasta aqui lo tengo bien: window.frames["nombreIframe"]. ( en lo demas tego aun problemas) location.href = elSelect.value; esto en lo del select.value ¿pongo las tres direcciones aqui???' o como??'

muchas gracias por las molestias que te tomas al responder....................

asi lo tengo:

<script LANGUAGE="JavaScript">
function abreSitio(){
var URL = "h t t p: / /";
var web = document.form1.sitio.options[document.form1.sitio.selectedIndex].value;
window.frames["cambio"].location.href = que va aqui;
}
</script>

</head>
<body>

<form name="form1" target="_blank">
<select name="sitio">
<option>» Selecciona «</option>
<option value="google.com">Google</option>
<option value="yahoo.com">Yahoo</option>
<option value="hotmail.com">Hotmail</option>
</select>
<input type="button" value="Ir" onClick="javascript:abreSitio()">
</form>

caricatos · #9 (**permalink**) 26/08/2007, 01:26

Cita:

Iniciado por derkenuke

Hola core_2duo, Atomycko y jaco18.
...

@jaco18: Si lo que tienes es un iframe en vez de window.open() tendrás que utilizar algo como window.frames["nombreIframe"].location.href="http://www.pagina.com"; ...

Un saludo a todos.

Me extraña que comentes que no se puede usar open para enlazar a un iframe, ya que el segundo parámetro del open es la ventana destino, ya sea un popup o un iframe u otro marco, tan solo hay que usar ese segundo parámetro con el nombre del iframe

Sobre el tema concreto, en el value del option se pueden poner las 2 urls, separadas por algún carácter que luego debería usarse con una instrucción split() para separar ambos...

<select onchange="x = this.value.split(','); document.images.ejemplo = x[0]; window.open(x[1], 'ventanita')">
<option value="imagen1.gif,enlace1.html"> opción 1</option>
<option value="imagen2.gif,enlace2.html"> opción 2</option>
<option value="imagen3.gif,enlace3.html"> opción 3</option>
<select>
...
<img name="ejemplo" alt="ejemplo" src="imagen.gif" />
...
<iframe name="ventanita" ></iframe>

Saludos

jaco18 · #10 (**permalink**) 26/08/2007, 06:56

Cita:

Iniciado por caricatos

Me extraña que comentes que no se puede usar open para enlazar a un iframe, ya que el segundo parámetro del open es la ventana destino, ya sea un popup o un iframe u otro marco, tan solo hay que usar ese segundo parámetro con el nombre del iframe

Sobre el tema concreto, en el value del option se pueden poner las 2 urls, separadas por algún carácter que luego debería usarse con una instrucción split() para separar ambos...

<select onchange="x = this.value.split(','); document.images.ejemplo = x[0]; window.open(x[1], 'ventanita')">
<option value="imagen1.gif,enlace1.html"> opción 1</option>
<option value="imagen2.gif,enlace2.html"> opción 2</option>
<option value="imagen3.gif,enlace3.html"> opción 3</option>
<select>
...
<img name="ejemplo" alt="ejemplo" src="imagen.gif" />

...
<iframe name="ventanita" ></iframe>

Saludos

Exelente caricatos muchisimas gracias me funciono perfecto.......................

derkenuke · #11 (**permalink**) 26/08/2007, 08:12

Cita:

Iniciado por caricatos

Me extraña que comentes que no se puede usar open para enlazar a un iframe, ya que el segundo parámetro del open es la ventana destino, ya sea un popup o un iframe u otro marco, tan solo hay que usar ese segundo parámetro con el nombre del iframe

¡Se me había olvidado completamente! jeje.
Gracias por el apunte

caricatos · #12 (**permalink**) 26/08/2007, 10:35

Cita:

Iniciado por jaco18

Exelente caricatos muchisimas gracias me funciono perfecto.......................

¡Magnífico...!

Cita:

Iniciado por derkenuke

¡Se me había olvidado completamente! jeje.
Gracias por el apunte

Dicen que el diablo "más sabe por viejo"...

Saludos