¿Cómo cerrar la pestaña actual en una ventana del navegador?
Quiero crear un enlace en una página web que cierre la pestaña actualmente activa en un navegador sin cerrar otras pestañas en el navegador.
Cuando el usuario hace clic en el enlace de cierre, debería aparecer un mensaje de alerta pidiéndole que confirme con dos botones, "SÍ" y "NO". Si el usuario hace clic en "SÍ", cierre esa página y si dice "NO", no haga nada.
¿Cómo puede hacerse esto? ¿Alguna sugerencia?
Necesitará Javascript para hacer esto. Usar window.close()
:
close();
Nota: la pestaña actual está implícita. Esto es equivalente:
window.close();
o puede especificar una ventana diferente.
Entonces:
function close_window() {
if (confirm("Close Window?")) {
close();
}
}
con HTML:
<a href="javascript:close_window();">close</a>
o:
<a href="#" onclick="close_window();return false;">close</a>
Está return false
aquí para evitar el comportamiento predeterminado del evento. De lo contrario, el navegador intentará ir a esa URL (que obviamente no es así).
Ahora las opciones en el window.confirm()
cuadro de diálogo serán Aceptar y Cancelar (no Sí y No). Si realmente desea Sí y No, deberá crear algún tipo de cuadro de diálogo modal de Javascript.
Nota: existen diferencias específicas del navegador con lo anterior. Si abrió la ventana con Javascript (a través de window.open()
), podrá cerrar la ventana con JavaScript. Firefox no le permite cerrar otras ventanas. Creo que IE le pedirá confirmación al usuario. Otros navegadores pueden variar.
Prueba esto
<a href="javascript:window.open('','_self').close();">close</a>
Este método funciona en Chrome e IE:
<a href="blablabla" onclick="setTimeout(function(){var ww = window.open(window.location, '_self'); ww.close(); }, 1000);">
If you click on this the window will be closed after 1000ms
</a>
Por lo que yo sé, ya no es posible en Chrome o Firefox. Es posible que todavía sea posible en IE (al menos antes de Edge).
Perdón por publicar esto, pero recientemente implementé un sitio alojado localmente que necesitaba la capacidad de cerrar la pestaña actual del navegador y encontré algunas soluciones interesantes que no están bien documentadas en ningún lugar que pude encontrar.
Nota: Estas soluciones se realizaron teniendo en mente un sitio alojado localmente y (con la excepción de Edge) requieren que el navegador esté configurado específicamente; los navegadores no configurados (típicos de sitios alojados públicamente) tienen una funcionalidad limitada.
Contexto:
En el pasado, el script jQuery window.close()
podía cerrar la pestaña actual sin problemas en la mayoría de los navegadores. Sin embargo, la mayoría de los navegadores modernos ya no admiten este script, posiblemente por motivos de seguridad.
Funcionalidad actual:
window.close()
funcionará en pestañas abiertas por un script o por un ancla con target="_blank"
(abierto en una nueva pestaña) sin requerir ninguna instalación o configuración adicional.
Vea el comentario de @killstreet sobre la respuesta de @calios
Soluciones alternativas específicas del navegador:
Google Chrome:
Chrome no permite que se ejecute el script window.close() y no sucede nada si intentas usarlo. Sin embargo, al usar el complemento de Chrome TamperMonkey, podemos usar el método window.close() si lo incluye // @grant window.close
en el encabezado UserScript de TamperMonkey.
Por ejemplo, mi secuencia de comandos (que se activa cuando se hace clic en un botón con id = 'cerrar_página' y si se presiona 'sí' en la ventana emergente del navegador) se ve así:
// ==UserScript==
// @name Close Tab Script
// @namespace http://tampermonkey.net/
// @version 1.0
// @description Closes current tab when triggered
// @author Mackey Johnstone
// @match http://localhost/index.php
// @grant window.close
// @require http://code.jquery.com/jquery-3.4.1.min.js
// ==/UserScript==
(function() {
'use strict';
$("#close_page").click(function() {
var confirm_result = confirm("Are you sure you want to quit?");
if (confirm_result == true) {
window.close();
}
});
})();
Nota: Sin embargo, esta solución solo puede cerrar la pestaña si NO es la última pestaña abierta. Específicamente, no puede cerrar la pestaña si eso provocara que se cerrara la ventana.
Firefox:
Firefox tiene una configuración avanzada que puede habilitar para permitir que los scripts cierren ventanas, habilitando efectivamente el window.close()
método. Para habilitar esta configuración, vaya a about:config, luego busque y encuentre la preferencia dom.allow_scripts_to_close_windows y cámbiela de falso a verdadero.
Esto le permite utilizar el window.close()
método directamente en su archivo jQuery como lo haría con cualquier otro script.
Por ejemplo, este script funciona perfectamente con la preferencia establecida en verdadero:
<script>
$("#close_page").click(function() {
var confirm_result = confirm("Are you sure you want to quit?");
if (confirm_result == true) {
window.close();
}
});
</script>
Esto funciona mucho mejor que la solución alternativa de Chrome, ya que permite al usuario cerrar la pestaña actual incluso si es la única pestaña abierta y no requiere un complemento de terceros. Sin embargo, la única desventaja es que también permite que este script se ejecute en diferentes sitios web (no solo en aquel en el que desea usarlo), por lo que podría ser un peligro para la seguridad, aunque no puedo imaginar que cerrar la pestaña actual sea particularmente peligroso.
Borde:
Lamentablemente, Edge obtuvo el mejor rendimiento de los 3 navegadores que probé y trabajó con el window.close()
método sin necesidad de ninguna configuración. Cuando window.close()
se ejecuta el script, una ventana emergente adicional le avisa de que la página está intentando cerrar la pestaña actual y le pregunta si desea continuar.
Editar: esto estaba en la versión anterior de Edge que no estaba basada en Chrome. No lo he probado, pero imagino que actuará de manera similar a Chrome en versiones basadas en Chrome.
Nota final: Las soluciones tanto para Chrome como para Firefox son soluciones alternativas para algo que los navegadores desactivaron intencionalmente, potencialmente por razones de seguridad. Ambos también requieren que el usuario configure sus navegadores para que sean compatibles de antemano, por lo que probablemente no serían viables para sitios destinados a uso público, pero son ideales para soluciones alojadas localmente como la mía.