Cuando estamos utilizando los enlaces HTML dentro de una página web vemos que su comportamiento natural es el de abrir la página o parte en concreto de la página sobre alguno de los marcos del navegador (misma venta, ventana padre, algún frame,…).
Mediante el lenguaje HTML nos veremos limitados a este funcionamiento. Si queremos hacer otro tipo de cosas deberemos de utilizar el lenguaje de Scripting, JavaScript. Mediante este lenguaje podremos modificar las propiedades del navegador y modificar su comportamiento. Así, podremos llevar a cabo que cuando pinchemos en un enlace, este, abra dos URL de destino, en vez de una.
Antes de empezar a explicar como hacer esto, cabe indicar que esta potencia tiene ciertas limitaciones. Ya que esto limitará la creación de páginas accesibles o destinadas a dispositivos que no interpreten el JavaScript. Como podría ser el caso de los móviles.
Pongamonos manos a la obra. La idea inicial es abrir dos ventanas con dos URLs. Para ello lo primero que tenemos que saber es como se abre vía JavaScript una ventana. Esto lo haremos mediante el objeto window del DOM de los navegadores y su propiedad .open(). Veamos la línea de código:
window.open (url:string,nombreVentana:string,caracteristicas :string);
A si que lo que haremos será crear una función que realice dos llamadas al método open. Dicha función recibirá como parámetro las dos URL que queramos abrir.
function abrirEnlaces(url1,url2){
window.open(url1);
window.open(url2);
}
La función será llamada cuando pulsemos en un enlace. Para controlar esta pulsación deberemos de basarnos en la gestión de eventos. El evento a capturar será el evento onClick que reciba el enlace.
Enlace que abre dos ventanas
Lo que sucede es que antes de procesar el evento JavaScript, el navegador va a procesar el propio evento HTML de la página. Es por ello que deberemos de deshabilitar este mecanismo indicando que la navegación del enlace HTML es «#». Esto significa que la navegación es el mismo sitio donde te encuentras.
Quedandonos la línea de código de la siguiente forma:
;
Enlace que abre dos ventanas
