Cerrar ventanas hijas
Problema:
Como podemos cerrar ventanas que se han creado y abierto desde una página web
En ocasiones necesitamos crear una o varias ventanas hijas desde la ventana principal de nuestra página, y sería estupendo que al cerrar la ventana madre, o abandonar la página mostrada en ella, también se cerraran las ventanas hijas.
Por ejemplo puedo tener una ventana principal con un enlace que se abre en una ventana hija en la que se muestran avisos o mensajes y quiero que al cerrar la ventana madre o abandonar la página actual las ventana hija se cierre para ahorrarle al visitante el tener que cerrarla a mano.
Solución
Usar el evento unload, cuando se dispara cerramos todas las ventanas hijas
La solución es muy fácil: se trata de hacer uso del evento unload, un evento que se dispara cuando
- cambia el contenido de la ventana del explorador, es decir, cuando el usuario abandona la página que está viendo.
- cuando el usuario cierra la ventana del explorador.
Basta con vincularle una función que cierre las ventanas que anteriormente se abrieron usando el método window.open
Ejemplo
Un ejemplo sencillo que muestra como poner en práctica esta solución sería el que se muestra aquí abajo:
var ventanaHija = null;
function crearHija( )
{
window.vHija = window.open("avisos.htm","ventana_hija");
}
function cerrarHija()
{
window.vHija.close( )
}
En la página colocamos el evento vinculado:
<body onunload="cerrarHija()">
<a href="javascript:crearHija()">Abre avisos</a>
La variable vHija sería el objeto window devuelto por window.open( ) cuando se creó la ventana hija.
Se guarda como propiedad del objeto global window
Se supone que en esta página existirá algún enlace, botón o evento que llamará a la función crearHija( )