有什么办法可以检测到IE8中窗口当前处于活动状态(正在显示在活动选项卡/窗口中)?有没有什么办法可以检测IE8当前活动的窗口?
我知道有像onfocusin
/onfocus
事件 - 但是这不是一个完美的解决方案,因为窗口也必须接收焦点的事件被解雇 - 因此,当用户只需切换标签页也不会触及这不起作用窗户本身。
我相信这样的普通用例必须有一些简单而优雅的解决方案。
有什么办法可以检测到IE8中窗口当前处于活动状态(正在显示在活动选项卡/窗口中)?有没有什么办法可以检测IE8当前活动的窗口?
我知道有像onfocusin
/onfocus
事件 - 但是这不是一个完美的解决方案,因为窗口也必须接收焦点的事件被解雇 - 因此,当用户只需切换标签页也不会触及这不起作用窗户本身。
我相信这样的普通用例必须有一些简单而优雅的解决方案。
这是一个简单task实现使用jQuery:
$(function() {
window.isActive = true;
$(window).focus(function() { this.isActive = true; });
$(window).blur(function() { this.isActive = false; });
});
全局isActive变量确定阉羊的标签/窗口是acive。
不幸的是,并不那么简单。在IE中试试这个 - 事件处理程序将被调用来每次点击文档,这不是非常有效。请参阅[我的答案](http://stackoverflow.com/a/9634295/96656)了解优化的解决方案。 – 2012-03-09 12:51:25
对于一个跨浏览器并处理使用'.blur | .focus'产生的“问题”的插件,请尝试在此处查看答案 - > [是否有方法检测浏览器窗口当前是否处于活动状态? ](http://stackoverflow.com/questions/1060008/is-there-a-way-to-detect-if-a-browser-window-is-not-currently-active#answer-16043687) – SpYk3HH 2013-12-02 18:47:39
var isActive = false;
function onBlur() {
isActive = false;
};
function onFocus(){
isActive = true;
};
if (/*@[email protected]*/false) { // check for Internet Explorer
document.onfocusin = onFocus;
document.onfocusout = onBlur;
} else {
window.onfocus = onFocus;
window.onblur = onBlur;
}
我写了一个jQuery插件,做到这一点:http://mths.be/visibility它给你一个非常简单的API,允许你执行回调时,页面的可见性状态的变化。
它通过在支持它的地方使用the Page Visibility API并在旧版浏览器中回落到旧版本focus
和blur
。
演示:http://mathiasbynens.be/demo/jquery-visibility
这个插件仅仅提供了两个自定义事件供您使用: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
)在$.support.pageVisibility
:
if ($.support.pageVisibility) {
// Page Visibility is natively supported in this browser
}
谢谢你的回答。我查看了网页,IE10中包含了Page Visibility API。看起来对于旧版本,我们必须坚持做得很好 - 不是非常好的模糊/焦点:) – 2012-03-09 13:56:12
如果用户在页面上切换另一个程序,这也不起作用。只需在标签之间切换即可。 – xecute 2013-04-01 13:59:34
对于一个跨浏览器并处理使用'.blur | .focus'出现的“问题”的插件,请尝试在此处查看答案 - > [是否有方法检测浏览器窗口当前是否处于活动状态? ](http://stackoverflow.com/questions/1060008/is-there-a-way-to-detect-if-a-browser-window-is-not-currently-active#answer-16043687) – SpYk3HH 2013-12-02 18:46:18
<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>
要做到这一点,最好的办法是使用网页浏览权限API。但是,此API在旧版浏览器中不可用。我写了一个jQuery插件,它使用可用的最佳API来检测页面是否可见:http://stackoverflow.com/a/9634295/96656 – 2012-03-09 13:13:27