Exécuter le code JavaScript à la fermeture de la fenêtre ou à l'actualisation de la page?

Existe-t-il un moyen d'exécuter un code JavaScript final lorsqu'un utilisateur ferme une fenêtre de navigateur ou actualise la page?

Je pense à quelque chose de similaire à onload mais plutôt à onclose? Merci.

Je n'aime pas la méthode onbeforeunload, qui cède toujours à une boîte de confirmation qui apparaît (quitter la page / rester sur mozilla) ou (recharger / ne pas recharger sur chrome). Existe-t-il un moyen d'exécuter le code tranquillement?

Il y a les deux window.onbeforeunloadet window.onunload, qui sont utilisés différemment selon le navigateur. Vous pouvez les associer soit en définissant les propriétés de la fenêtre sur des fonctions, soit en utilisant .addEventListener:

window.onbeforeunload = function(){
   // Do something
}
// OR
window.addEventListener("beforeunload", function(e){
   // Do something
}, false);

Habituellement, onbeforeunloadest utilisé si vous devez empêcher l'utilisateur de quitter la page (par exemple, l'utilisateur travaille sur des données non enregistrées, il doit donc enregistrer avant de quitter). onunloadn'est pas pris en charge par Opera , pour autant que je sache, mais vous pouvez toujours définir les deux.

Ok, j'ai trouvé une solution de travail pour cela, cela consiste à utiliser l' beforeunloadévénement puis à faire revenir le gestionnaire null. Cela exécute le code souhaité sans qu'une boîte de confirmation ne s'affiche. Ca fait plutot comme ca:

window.onbeforeunload = closingCode;
function closingCode(){
   // do something...
   return null;
}

J'espère que cela t'aides.

Parfois, vous souhaiterez peut-être informer le serveur que l'utilisateur quitte la page. Ceci est utile, par exemple, pour nettoyer les images non enregistrées stockées temporairement sur le serveur, pour marquer cet utilisateur comme "hors ligne" ou pour se connecter quand il a terminé sa session.

Historiquement, vous enverriez une requête AJAX dans la beforeunloadfonction, mais cela pose deux problèmes. Si vous envoyez une demande asynchrone, il n'y a aucune garantie que la demande sera exécutée correctement. Si vous envoyez une requête synchrone, elle est plus fiable, mais le navigateur se bloque jusqu'à ce que la requête soit terminée. S'il s'agit d'une demande lente, ce serait un énorme inconvénient pour l'utilisateur.

Heureusement, nous l'avons maintenant navigator.sendBeacon(). En utilisant la sendBeacon()méthode, les données sont transmises de manière asynchrone au serveur Web lorsque l'agent utilisateur a la possibilité de le faire, sans retarder le déchargement ni affecter les performances de la navigation suivante. Cela résout tous les problèmes liés à la soumission des données d'analyse: les données sont envoyées de manière fiable, elles sont envoyées de manière asynchrone et cela n'a pas d'impact sur le chargement de la page suivante. Voici un exemple de son utilisation:

window.addEventListener("unload", logData, false);

function logData() {
  navigator.sendBeacon("/log.php", analyticsData);
}

sendBeacon()est pris en charge dans:

• Bord 14
• Firefox 31
• Chrome 39
• Safari 11.1
• Opéra 26
• iOS Safari 11.4

Il n'est actuellement PAS pris en charge dans:

• Internet Explorer
• Opera Mini

Voici un polyfill pour sendBeacon () au cas où vous auriez besoin d'ajouter la prise en charge des navigateurs non pris en charge. Si la méthode n'est pas disponible dans le navigateur, elle enverra à la place une requête AJAX synchrone.

Version jQuery:

$(window).unload(function(){
    // Do Something
});

Mise à jour : jQuery 3:

$(window).on("unload", function(e) {
    // Do Something
});

Merci Garrett

La documentation ici encourage l'écoute de l'événement onbeforeunload et / ou l'ajout d'un écouteur d'événement sur window.

window.addEventListener('beforeunload', function(event) {
  //do something here
}, false);

Vous pouvez également simplement renseigner les propriétés .onunload ou .onbeforeunload de window avec une fonction ou une référence de fonction.

Bien que le comportement ne soit pas normalisé entre les navigateurs, la fonction peut renvoyer une valeur que le navigateur affichera lors de la confirmation de quitter la page.

Vous pouvez utiliser window.onbeforeunload.

window.onbeforeunload = confirmExit;
function confirmExit(){
    alert("confirm exit is being called");
    return false;
}

L'événement est appelé beforeunload, vous pouvez donc attribuer une fonction à window.onbeforeunload.

Vous pouvez essayer quelque chose comme ceci:

<SCRIPT language="JavaScript">
<!--
function loadOut()
{
window.location="http://www.google.com";
}
//-->
</SCRIPT>

<body onBeforeUnload="loadOut()">