visibilitychangeイベント
例
タブのコンテンツが表示されるか非表示になったときに、JavaScriptコードを実行します:
document.addEventListener('visibilitychange', function() {
if (document.visibilityState === 'visible') {
//ページが表示状態になったときに実行する操作
} else if (document.visibilityState === 'hidden') {
//ページが非表示状態になったときに実行する操作
}
});
試してみる »
定義と用法
visibilitychange イベントは、ブラウザーの Document オブジェクトで発生するイベントで、現在のページの可視性状態が変化したかどうかを検出するために使用されます。
ユーザーが他のタブに切り替えたり、ブラウザーウィンドウを最小化したり、ブラウザーウィンドウを他のウィンドウの後ろに隠したりすると、ページの可視性が変化し、そのときに visibilitychange イベントが発生します。
構文
document.addEventListener('visibilitychange', function() {
if (document.visibilityState === 'visible') {
// 页面变为可见状态时执行的操作
} else if (document.visibilityState === 'hidden') {
// 页面变为不可见状态时执行的操作
}
});
ブラウザサポート
| イベント | |||||
|---|---|---|---|---|---|
| ondrop | 62 | 18 | 56 | 14.1 | 49 |
注意:visibilitychangeイベントの動作はブラウザーによって異なる場合があるため、使用時にはブラウザーの互換性に注意する必要があります。さらに、一部のモバイルデバイスやコンピューターの省電力モードがページの可視性状態に影響し、このイベントを引き起こす可能性があります。
イベントオブジェクト その他の拡張