WindowEventHandlers.onpopstate
onpopstate
は WindowEventHandlers
ミックスインのプロパティで、ウィンドウの popstate
イベントを処理するためのイベントハンドラーです。
popstate
イベントは、同じ文書の2つの履歴項目の間で、アクティブな履歴項目が変わるたびにウィンドウに発行されます。アクティブな履歴項目が history.pushState()
を呼び出したことで作成されたり、 history.replaceState()
を呼び出したことで影響されたりした場合、 popstate
イベントの状態オブジェクトが履歴項目の状態オブジェクトのコピーを保持します。
Note: history.pushState()
または history.replaceState()
を呼び出すこと自体は、 popstate
イベントのトリガーにはなりません。 popstate
イベントは、戻るボタンをクリックしたり(または JavaScript で history.back()
を呼び出したり)、同じ文書で 2 つの履歴項目間を移動したりするように、ブラウザーのアクションを実行することのみがトリガーになります。
構文
window.onpopstate = funcRef;
funcRef
はハンドラー関数です。
例
例えば、http://example.com/example.html
のページで次のコードを実行すると、示されているようにアラートを生成します。
window.onpopstate = function(event) {
alert("location: " + document.location + ", state: " + JSON.stringify(event.state));
};
history.pushState({page: 1}, "title 1", "?page=1");
history.pushState({page: 2}, "title 2", "?page=2");
history.replaceState({page: 3}, "title 3", "?page=3");
history.back(); // "location: http://example.com/example.html?page=1, state: {"page":1}" とアラート
history.back(); // "location: http://example.com/example.html, state: null" とアラート
history.go(2); // "location: http://example.com/example.html?page=3, state: {"page":3}" とアラート
なお、元の履歴項目(この場合は http://example.com/example.html
)には関連付けられる状態オブジェクトがありませんが、それでも 2 回目の history.back()
の呼び出し後に項目がアクティブになったとき、 popstate
イベントが発行されます。
仕様書
No specification found
No specification data found for api.WindowEventHandlers.onpopstate
.
Check for problems with this page or contribute a missing spec_url
to mdn/browser-compat-data. Also make sure the specification is included in w3c/browser-specs.
ブラウザーの互換性
No compatibility data found for api.WindowEventHandlers.onpopstate
.
Check for problems with this page or contribute missing data to mdn/browser-compat-data.