diff options
Diffstat (limited to 'files/fr/web/api/window/unload_event/index.html')
| -rw-r--r-- | files/fr/web/api/window/unload_event/index.html | 156 |
1 files changed, 156 insertions, 0 deletions
diff --git a/files/fr/web/api/window/unload_event/index.html b/files/fr/web/api/window/unload_event/index.html new file mode 100644 index 0000000000..676b6187e3 --- /dev/null +++ b/files/fr/web/api/window/unload_event/index.html @@ -0,0 +1,156 @@ +--- +title: unload +slug: Web/Events/unload +tags: + - JavaScript + - events +translation_of: Web/API/Window/unload_event +--- +<p><br> + <span class="seoSummary">L'événement <code>unload</code> est appelé lorsque le document ou une ressource enfant est en train d'être déchargé.</span></p> + +<p>Il est lancé après :</p> + +<ol> + <li><a href="/en-US/docs/Mozilla_event_reference/beforeunload" title="/en-US/docs/Mozilla_event_reference/beforeunload">beforeunload</a> (événement annulable)</li> + <li><a href="/en-US/docs/Mozilla_event_reference/pagehide" title="/en-US/docs/Mozilla_event_reference/pagehide">pagehide</a></li> +</ol> + +<p>Le document se trouve alors dans un état particulier :</p> + +<ul> + <li>Toutes les ressources existent encore (img, iframe etc.)</li> + <li>Plus rien n'est encore visible par l'utilisateur final</li> + <li>Les intéractions avec l'interface sont désactivées (<code>window.open</code>, <code>alert</code>, <code>confirm</code>, etc.)</li> + <li>Aucune erreur ne viendra interrompre le flux de déchargement.</li> +</ul> + +<p>Veuiller noter que l'événement <code>unload</code> suit l'ordre du document : le cadre parent est déchargé <em>avant</em> le <code>unload</code> d'un cadre enfant (voir l'exemple ci-dessous).</p> + +<table class="properties"> + <tbody> + <tr> + <td>Événement propageable</td> + <td>Non</td> + </tr> + <tr> + <td>Annulable</td> + <td>Non</td> + </tr> + <tr> + <td>Objets cibles</td> + <td>defaultView, Document, Element</td> + </tr> + <tr> + <td>Interface</td> + <td>{{domxref("UIEvent")}} si généré depuis un élément de l'interface utilisateur, {{domxref("Event")}}</td> + </tr> + <tr> + <td>Action par défaut</td> + <td>Aucune</td> + </tr> + </tbody> +</table> + +<h2 id="Propriétés">Propriétés</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Propriété</th> + <th scope="col">Type</th> + <th scope="col">Description</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>target</code> {{readonlyInline}}</td> + <td><a href="/en-US/docs/Web/API/EventTarget" title="EventTarget is an interface implemented by objects that can receive events and may have listeners for them."><code>EventTarget</code></a></td> + <td>La cible de l'événement (la cible de plus haut niveau dans le DOM).</td> + </tr> + <tr> + <td><code>type</code> {{readonlyInline}}</td> + <td><a href="/en-US/docs/Web/API/DOMString" title="DOMString is a UTF-16 String. As JavaScript already uses such strings, DOMString is mapped directly to a String."><code>DOMString</code></a></td> + <td>Le type d'événement.</td> + </tr> + <tr> + <td><code>bubbles</code> {{readonlyInline}}</td> + <td><a href="/en-US/docs/Web/API/Boolean" title="The Boolean object is an object wrapper for a boolean value."><code>Boolean</code></a></td> + <td>Si l'événement remonte ou non.</td> + </tr> + <tr> + <td><code>cancelable</code> {{readonlyInline}}</td> + <td><a href="/en-US/docs/Web/API/Boolean" title="The Boolean object is an object wrapper for a boolean value."><code>Boolean</code></a></td> + <td>Si l'événement est annulable ou non.</td> + </tr> + <tr> + <td><code>view</code> {{readonlyInline}}</td> + <td><a class="new" href="/en-US/docs/Web/API/WindowProxy" rel="nofollow" title="The documentation about this has not yet been written; please consider contributing!"><code>WindowProxy</code></a></td> + <td><a href="/en-US/docs/Web/API/Document/defaultView" title="In browsers, document.defaultView returns the window object associated with a document, or null if none is available."><code>document.defaultView</code></a> (<code>fenêtre</code> du document)</td> + </tr> + <tr> + <td><code>detail</code> {{readonlyInline}}</td> + <td><code>long</code> (<code>float</code>)</td> + <td>0.</td> + </tr> + </tbody> +</table> + +<h2 id="Exemple">Exemple</h2> + +<pre class="brush: html"><!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></pre> + +<p>Ci-dessous, le contenu de <code>child-frame.html</code>:</p> + +<pre class="brush: 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></pre> + +<p>Quand le cadre parent est déchargé, les événements sont lancés dans l'ordre décrit par les messages <code>console.log</code>.</p> + +<h2 id="Événements_liés">Événements liés</h2> + +<ul> + <li>{{event("DOMContentLoaded")}}</li> + <li>{{event("readystatechange")}}</li> + <li>{{event("load")}}</li> + <li>{{event("beforeunload")}}</li> + <li>{{event("unload")}}</li> +</ul> + +<h2 id="Spécifications">Spécifications</h2> + +<ul> + <li><a href="https://html.spec.whatwg.org/multipage/browsers.html#unloading-documents" title="http://www.whatwg.org/specs/web-apps/current-work/#unload-a-document">Unloading Documents — unload a document</a></li> + <li><a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-unload" title="http://www.w3.org/TR/DOM-Level-3-Events/#event-type-unload">Event Module Definition — unload</a></li> +</ul> |