在浏览器中的 Tab 开关上暂停视频，但在最小化浏览器窗口时应继续播放

Posted 2023-02-21

【中文标题】在浏览器中的 Tab 开关上暂停视频，但在最小化浏览器窗口时应继续播放

【英文标题】：Pause video on Tab switch in browser but should continue Playing when minimized the browser window

【发布时间】：2021-12-09 16:46:13

【问题描述】：

当用户在浏览器中切换选项卡时，我试图暂停视频，同时如果用户最小化浏览器窗口，它不应该暂停。 我尝试通过使用 PageVisibility Api 来实现它，但是在这两种情况下，视频都会暂停。 我只需要在选项卡打开时暂停，而不是在窗口最小化时暂停。

var videoElement = document.getElementById("videoElement");
document.addEventListener("visibilitychange", function() 
        if(document.visibilityState==="hidden")
        
            videoElement.pause();
        
        else if(document.visibilityState==="visible")
        
            videoElement.play();
              
)

【参考方案1】：

document.addEventListener("visibilitychange", function() 
    if (document.hidden)
        console.log("Browser tab is hidden")
     else 
        console.log("Browser tab is visible")
   
);