Para mostrar un mensaje de confirmación, se usa el evento beforeunload
, el handler debe retornar el string de la confirmación. En algunos navegadores esto se establece en el propio evento.
window.addEventListener("beforeunload", function (e) {
var confirmationMessage = "Esta seguro?";
e.returnValue = confirmationMessage; // Gecko, Trident, Chrome 34+
return confirmationMessage; // Gecko, WebKit, Chrome <34
});
Segun la MDN esta es la forma mas cross-browser.
Durante este evento, es licito hacer cambios en el DOM ya que la pagina no se ha descargado, sin embargo alert
, confirm
o prompt
no tienen ningún efecto en los navegadores que cumplan con la especificación HTML5.
Si solamente estas interesado en ejecutar una acción cuando la pagina se descarga, puedes usar el evento unload
.
window.addEventListener('unload', function(event) {
// acciones aquí.
});
Con este evento, el estado de la pagina es el siguiente:
- La pagina ya no esta visible.
- Las interacciones con la UI no tienen efecto (window.open, alert, confirm etc.)
Nota:
Hay que tener en cuenta que intentar una llamada ajax en cualquiera de estos eventos puede tener consecuencias negativas si la respuesta del servidor tarda en recibirse. Es recomendable utilizar una solicitud sincrónica, lo cual bloquea el workflow de descarga. Pero esto tiene a su vez, un impacto importante en el tiempo de la descarga de la pagina y en la experiencia del usuario.