--- title: window.onpopstate slug: Web/API/WindowEventHandlers/onpopstate translation_of: Web/API/WindowEventHandlers/onpopstate ---
{{ ApiRef() }}
{{ gecko_minversion_header("2") }}
Un gestionnaire d'évènement pour l'évènement popstate
de la fenêtre.
L'évènement popstate
est envoyé à la fenêtre à chaque fois que l'entrée actuelle de l'historique change avec 2 autres entrées du même document. Si l'entrée actuelle a été créée en appelant history.pushState()
ou a été modifiée en appelant history.replaceState()
, la propriété state de l'évènement popstate
contient une copie de l'objet d'entrée de l'historique.
Sachez qu'appeler history.pushState()
ou history.replaceState()
ne déclenchera pas l'évènement popstate
. Cet évènement n'est déclenché que par une action utilisateur telle que cliquer sur le bouton Retour (ou appeler history.back()
, en JavaScript). L'évènement n'est déclenché que pour la navigation entre deux entrées du même document.
window.onpopstate = funcRef;
funcRef
est une référence à une fonction.Par exemple, une page à l'adresse http://example.com/example.html exécutant le code suivant générera les alertes suivantes:
window.onpopstate = function(event) { alert("adresse: " + document.location + ", état: " + JSON.stringify(event.state)); }; history.pushState({page: 1}, "titre 1", "?page=1"); history.pushState({page: 2}, "titre 2", "?page=2"); history.replaceState({page: 3}, "titre 3", "?page=3"); history.back(); // affiche "adresse: http://example.com/example.html?page=1, état: {"page":1}" history.back(); // affiche "adresse: http://example.com/example.html, état: null history.go(2); // affiche "adresse: http://example.com/example.html?page=3, état: {"page":3}
Même si l'entrée originelle (de http://example.com/example.html) n'a aucun objet d'état associé, l'évènement popstate
est toujours déclenché lorsque l'entrée est activée après un deuxième appel à history.back()
.