Javascript 有没有办法检测IE8中当前活动的窗口？

有没有办法检测IE8中的窗口当前处于活动状态（显示在活动选项卡/窗口上）

我知道有些事件类似于

onfocusin

/

onfocus

-但这不是一个完美的解决方案，因为窗口也必须接收焦点才能触发事件-因此，当用户只切换选项卡而不触摸窗口本身时，这不起作用

我相信对于这样的普通用例，必须有一些简单、优雅的解决方案。

这是使用jQuery实现的一个简单方法：

$(function() {
    window.isActive = true;
    $(window).focus(function() { this.isActive = true; });
    $(window).blur(function() { this.isActive = false; });
});

---

全局isActive变量确定选项卡/窗口是否活动

我编写了一个jQuery插件，它可以做到这一点：它提供了一个非常简单的API，允许您在页面的可见性状态发生变化时执行回调

var isActive = false;
function onBlur() {
    isActive = false;
};
function onFocus(){
    isActive = true;
};

if (/*@cc_on!@*/false) { // check for Internet Explorer
    document.onfocusin = onFocus;
    document.onfocusout = onBlur;
} else {
    window.onfocus = onFocus;
    window.onblur = onBlur;
}

它通过在支持它的地方使用，并在旧浏览器中返回到良好的旧

焦点

和

模糊

来实现

演示：

该插件只提供两个自定义事件供您使用：

show

和

hide

。当页面可见性状态更改时，将触发相应的事件

您可以单独使用它们：

$(document).on('show', function() {
  // the page gained visibility
});

……还有

$(document).on('hide', function() {
  // the page was hidden
});

由于大多数情况下您都需要这两个事件，因此最好的选择是使用事件映射。这样，您可以一次性绑定两个事件处理程序：

$(document).on({
  'show': function() {
    console.log('The page gained visibility; the `show` event was triggered.');
  },
  'hide': function() {
    console.log('The page lost visibility; the `hide` event was triggered.');
  }
});

该插件将检测浏览器是否本机支持页面可见性API，并在

$中以布尔值（
true
/
false
）形式公开此信息。支持。页面可见性

：

if ($.support.pageVisibility) {
  // Page Visibility is natively supported in this browser
}

//改编自山姆·达顿
//设置隐藏属性和可见性更改事件的名称
//因为有些浏览器只提供厂商前缀支持
变量隐藏、状态、可视性更改；
if（typeof document.hidden！=“未定义”）{
hidden=“hidden”；
visibilityChange=“visibilityChange”；
state=“visibilityState”；
}else if（typeof document.mozHidden！=“未定义”）{
hidden=“mozHidden”；
visibilityChange=“mozvisibilitychange”；
state=“mozVisibilityState”；
}else if（typeof document.msHidden！=“未定义”）{
hidden=“msHidden”；
visibilityChange=“msvisibilitychange”；
state=“msVisibilityState”；
}else if（typeof document.webkitHidden！=“未定义”）{
hidden=“webkitshidden”；
visibilityChange=“webkitvisibilitychange”；
state=“webkitVisibilityState”；
}
//添加一个不断更改标题的侦听器
document.addEventListener（visibilityChange，function（）{
document.title=文件[状态]；
}，假）；
//设置初始值
document.title=文件[状态]；

有关详细信息，请参阅。

使用浏览器默认设置

---

不幸的是，事情并没有那么简单。在IE中试试这个-每次点击文档都会调用事件处理程序，这不是很有效。有关优化的解决方案，请参阅。对于跨浏览器并使用

.blur |处理出现的“问题”的插件，请尝试在此处查看答案->执行此操作的最佳方法是使用页面可见性API。但是，此API在较旧的浏览器中不可用。我已经编写了一个jQuery插件，它使用最好的API来检测页面是否可见：谢谢你的回答。我查看了网页，似乎IE10中包含了页面可见性API。似乎对于旧版本，我们必须坚持使用好的旧版本，但不能很好地工作模糊/聚焦：）如果用户在您的页面上切换另一个程序，这也不起作用。只需在选项卡之间切换即可。对于跨浏览器并使用
.blur |处理出现的“问题”的插件，请关注
，尝试在此处查看答案->@SpYk3HH上述插件是跨浏览器兼容的，并且没有任何已知的误报。你知道我的插件有什么漏洞吗？如果是这样，请报告它们。我真的很希望这对我的用例有用。不幸的是，仅当在同一浏览器窗口中的选项卡之间切换时，演示才起作用，而不能切换到其他浏览器窗口或其他程序。在Windows上的Chrome 73.0.3683.103（官方版本）（64位）和Firefox 66.0.3（64位）中确认。另请参阅：。
<script>

    // Adapted slightly from Sam Dutton
    // Set name of hidden property and visibility change event
    // since some browsers only offer vendor-prefixed support
    var hidden, state, visibilityChange; 
    if (typeof document.hidden !== "undefined") {
        hidden = "hidden";
        visibilityChange = "visibilitychange";
        state = "visibilityState";
    } else if (typeof document.mozHidden !== "undefined") {
        hidden = "mozHidden";
        visibilityChange = "mozvisibilitychange";
        state = "mozVisibilityState";
    } else if (typeof document.msHidden !== "undefined") {
        hidden = "msHidden";
        visibilityChange = "msvisibilitychange";
        state = "msVisibilityState";
    } else if (typeof document.webkitHidden !== "undefined") {
        hidden = "webkitHidden";
        visibilityChange = "webkitvisibilitychange";
        state = "webkitVisibilityState";
    }
    // Add a listener that constantly changes the title
    document.addEventListener(visibilityChange, function() {
        document.title = document[state];
    }, false);

    // Set the initial value
    document.title = document[state];

</script>

document.addEventListener("visibilitychange", () => { 
    if (document.visibilityState === 'visible') alert("Hello again"); 
});

function isPageHidden(){
    if (typeof(document.hidden) === 'boolean') return document.hidden;
    if (typeof(document.msHidden) === 'boolean') return document.msHidden;
    if (typeof(document.webkitHidden) === 'boolean') return document.webkitHidden;
    if (typeof(document.mozHidden) === 'boolean') return document.mozHidden;
    else return undefined;
}