--- title: unload slug: Web/API/Window/unload_event tags: - JavaScript - events translation_of: Web/API/Window/unload_event original_slug: Web/Events/unload ---


L'événement unload est appelé lorsque le document ou une ressource enfant est en train d'être déchargé.

Il est lancé après :

  1. beforeunload (événement annulable)
  2. pagehide

Le document se trouve alors dans un état particulier :

Veuiller noter que l'événement unload suit l'ordre du document : le cadre parent est déchargé avant le unload d'un cadre enfant (voir l'exemple ci-dessous).

Événement propageable Non
Annulable Non
Objets cibles defaultView, Document, Element
Interface {{domxref("UIEvent")}} si généré depuis un élément de l'interface utilisateur, {{domxref("Event")}}
Action par défaut Aucune

Propriétés

Propriété Type Description
target {{readonlyInline}} EventTarget La cible de l'événement (la cible de plus haut niveau dans le DOM).
type {{readonlyInline}} DOMString Le type d'événement.
bubbles {{readonlyInline}} Boolean Si l'événement remonte ou non.
cancelable {{readonlyInline}} Boolean Si l'événement est annulable ou non.
view {{readonlyInline}} WindowProxy document.defaultView (fenêtre du document)
detail {{readonlyInline}} long (float) 0.

Exemple

<!DOCTYPE html>
<html>
  <head>
    <title>Cadre parent</title>
    <script>
      window.addEventListener('beforeunload', function(event) {
        console.log('Je suis le 1er.');
      });
      window.addEventListener('unload', function(event) {
        console.log('Je suis le 3ème.');
      });
    </script>
  </head>
  <body>
    <iframe src="child-frame.html"></iframe>
  </body>
</html>

Ci-dessous, le contenu de child-frame.html:

<!DOCTYPE html>
<html>
  <head>
    <title>Cadre enfant</title>
    <script>
      window.addEventListener('beforeunload', function(event) {
        console.log('Je suis le 2nd.');
      });
      window.addEventListener('unload', function(event) {
        console.log('Je suis le 4ème et dernier…');
      });
    </script>
  </head>
  <body>
      ☻
  </body>
</html>

Quand le cadre parent est déchargé, les événements sont lancés dans l'ordre décrit par les messages console.log.

Événements liés

Spécifications