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 :
- beforeunload (événement annulable)
- pagehide
Le document se trouve alors dans un état particulier :
- Toutes les ressources existent encore (img, iframe etc.)
- Plus rien n'est encore visible par l'utilisateur final
- Les intéractions avec l'interface sont désactivées (
window.open
,alert
,confirm
, etc.) - Aucune erreur ne viendra interrompre le flux de déchargement.
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 | UIEvent si généré depuis un élément de l'interface utilisateur, Event |
Action par défaut | Aucune |
Propriétés
Propriété | Type | Description |
---|---|---|
target Lecture seule |
EventTarget |
La cible de l'événement (la cible de plus haut niveau dans le DOM). |
type Lecture seule |
DOMString |
Le type d'événement. |
bubbles Lecture seule |
Boolean |
Si l'événement remonte ou non. |
cancelable Lecture seule |
Boolean |
Si l'événement est annulable ou non. |
view Lecture seule |
WindowProxy |
document.defaultView (fenêtre du document) |
detail Lecture seule |
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
.