跳至主要内容

[WebAPIs] Page Visibility

適合使用在當使用者離開（縮小、關閉）某一頁籤後，原本的頁面要執行哪些行為（例如，暫停影音播放）。

document.visibilityState; // 取得頁面當前的狀態
  • visible：畫面當前是 active 的
  • hidden：可能是「視窗（window）被縮小」、「頁籤（tab）被切換」或「從裝置關閉」。
  • prerender：並非所有瀏覽器支援
  • unloaded：並非所有瀏覽器支援
注意

prerender 和 unloaded 這兩個狀態已從 Page Visibility API 規範中移除，現代瀏覽器不再支援。實務上只需處理 visible 和 hidden 兩種狀態即可。

// 事件 Document.onvisibilitychange
document.addEventListener('visibilitychange', function() { ... });

記得 change 的 c 是小寫。

參考​