Al realizar desarrollo web, a menudo utilizamos el evento de cierre de página antes de la descarga, que puede brindar a los usuarios la oportunidad de optar por abandonar el cierre, como este editor de blog. Si el usuario elige irse, el evento de descarga se activará naturalmente, pero si el usuario elige cancelar, ¿cómo detectarlo?
Suponemos que una página deja un evento de cancelación llamado onunloadcancel. Obviamente, este evento debería activarse después de que el usuario presione el botón Cancelar del cuadro de diálogo. Pero el proceso de activación para cerrar el cuadro de diálogo emergente no es tan simple. Primero revisemos el proceso:
Copie el código de código de la siguiente manera:
ventana.onbeforeunload = función()
{
return "¿Realmente te vas?";
}
Cuando el usuario está listo para abandonar la página (como presionar el botón de cerrar, actualizar la página, etc.), se activa el evento onbeforeunload. Nuestro script no puede decidir si evitar que la página se cierre en este evento. Lo único que puede hacer es devolver una cadena. Esta cadena solo aparece como texto explicativo en el cuadro de diálogo de selección de cierre. . Pero cuál elegir, no tenemos forma de saberlo.
Sin embargo, si analizamos esta cuestión detenidamente, en realidad no es así. Si el usuario realmente elige cerrar la página, todo el código en ejecución desaparecerá y si el usuario continúa en la página, se tratará como si no hubiera sucedido nada, excepto el evento onbeforeunload. Por lo tanto, hacemos un pequeño truco en el evento onbeforeunload y registramos un temporizador aquí que se iniciará después de unos pocos milisegundos. Si la página está realmente cerrada, entonces, por supuesto, el temporizador no será válido, entonces la página seguirá allí y el retraso. de unos pocos milisegundos No hay ningún error en este evento de interacción de interfaz inherentemente asíncrona.
Copie el código de código de la siguiente manera:
<lenguaje de escritura="JavaScript">
ventana.onbeforeunload = función()
{
setTimeout(onunloadcancel, 10);
return "¿Realmente te vas?";
}
ventana.onunloadcancel = función()
{
alert("cancelar salida");
}
</script>
Usamos setTimeout y retrasamos 10 ms para ejecutar onunloadcancel. Si la página está realmente cerrada, los temporizadores, por supuesto, se destruirán; de lo contrario, continúe. Pero durante las pruebas, se descubrió que Firefox tenía dos errores:
A veces, cuando se presiona el botón cerrar, también se ejecutará onunloadcancel y aparecerá un cuadro de diálogo. Si cambia a while(1); el navegador permanecerá bloqueado, lo que significa que onunloadcancel se ejecuta, pero solo destruye la interfaz, pero no detiene la ejecución del script.
Si sale actualizando la página, onbeforeunload se ejecutará solo una vez, pero si hace clic en el botón X para cerrar la página, onbeforeunload se ejecutará dos veces. Por lo tanto, todavía necesitamos mejorarlo para que sea compatible con FF.
Copie el código de código de la siguiente manera:
<lenguaje de escritura="JavaScript">
var_t;
ventana.onbeforeunload = función()
{
setTimeout(function(){_t = setTimeout(onunloadcancel, 0)}, 0);
return "¿Realmente te vas?";
}
ventana.onunloadcancel = función()
{
borrarTiempo de espera(_t);
alert("cancelar salida");
}
</script>
Aquí se utiliza un método cuyo motivo no puedo explicar. Debe considerarse como un truco para resolver el error en FF.