domingo, 21 de febrero de 2016

Un botón para un vínculo

Estamos acostumbrados a que los botones, en JavaSript, sirva para lanzar funciones que realicen lo que les hayamos programado.
Pero, por su estética, podemos emplear los botones como meros enlaces.
¿Qué código tenemos que escribir para que el botón funcione como hipervínculo?
<input onclick="location.href='http://direccion1.html'" type="button" value="Ir a la dirección 1" />

Por ejemplo:



Si queremos que el vínculo se abra en ventana nueva (target="_blank"), emplearemos el siguiente código:
<input onclick="window.open('http://direccion1.htm')" type="button" value="Ir a la dirección 1" />

Veamos un ejemplo:



Otro caso interesante es, enlazando con las dos entradas anteriores, emplear este sistema de botones para cargar vínculos en un iframe.
En ese caso, hay que añadir, delante de la cadena location.href el name que hayamos puesto al iframe. En este caso, lo hemos llamado demo. Por lo tanto la sintaxis es:
<input onclick="demo.location.href='http://direccion1.html'" type="button" value="Ir a la dirección 1" />

Veamos un ejemplo:

Finalmente, hemos creado una mezcla de el abrir un vínculo en ventana nueva (PopUp) con el tema del botón. El código podría ser algo así:
<a href="http://direccionURL.html" onclick="window.open(this.href, this.target, 'width=700,height=170'); return false;" target="popup" title="Ver en ventana nueva"><input  type="button" value="Mi página web" /></a>

No hay comentarios:

Publicar un comentario