检查网站是否在前台答案

【问题标题】：Check if site is in foreground检查网站是否在前台
【发布时间】：2012-08-29 20:10:25
【问题描述】：

我想检查我的网站是否在前台使用 JavaScript。但是在阅读所有内容之前不要回答，因为你会直接对我说我应该这样做this：

$(window)
    .focus(function() {
        console.log("focus");
    })
    .blur(function() {
        console.log("blur");
    });

但问题是我的页面上有来自第三方的 iframe，如果用户单击 iframe，则会触发窗口模糊事件，但用户实际上仍在我的页面上。我试图通过检查if document.activeElement is an iframe on blur来解决这个问题：

$(window)
    .focus(function() {
        console.log("focus");
    })
    .blur(function() {
        console.log("blur");
        if (document.activeElement.tagName.toLowerCase() == "iframe") {
            console.log("still focus");
        }
    });

这里的问题是当用户先点击 iframe 然后点击另一个应用程序时，我无法检查页面是否不再处于前台。

那么当网站中有 iframe 时，如何检查网站是否在前台？

【问题讨论】：

也许你可以使用this。
谢谢，这将涵盖现代浏览器的问题，但我还需要 IE8 支持。

标签： javascript jquery foreground

【解决方案1】：

您应该可以使用Page Visibility API。

本规范为网站开发人员定义了一种方法以编程方式确定页面的当前可见性状态为了开发功率和 CPU 高效的 Web 应用程序。

了解详情

示例

http://www.samdutton.com/pageVisibility/

【讨论】：

这将涵盖现代浏览器的问题，但我还需要 IE8 支持。
你听说过优雅降级吗？ stackoverflow.com/a/9634295/294076
不，但那家伙的所作所为太棒了。源代码看起来应该可以工作，但我还没有测试过。