如何捕获整个浏览器窗口的模糊和焦点?

我想捕捉实际浏览器窗口的模糊和焦点 – 这意味着将焦点更改为子帧不感兴趣。

目前我一直在使用$(top).focus() $(top).blur()

$(window).focus() $(window).blur()

但是,当用户将焦点更改为嵌入式iframe时,这些会触发,这是我不想要的。

有谁知道捕获TRUE激活和停用窗口的方法?

[编辑]

当用户从网页移动到嵌入式iframe的网页时,模糊和焦点事件会触发。 这与“窗口激活”事件不同,“事件激活”事件仅在实际的BROWSER窗口(或选项卡)被带到前面或被发送(即,更改或最小化)时触发。

我对模糊不感兴趣,因为用户导航到嵌入式框架的事实对程序没有影响。 但是,如果用户最小化窗口,更改选项卡或切换到另一个程序,我想知道它…

你不需要jquery。
window.onblur和window.onfocus可以解决你的问题:)

 (function(){ var timer = null; var has_switched = false; window.onblur = function(){ timer = settimeout(changeitup, 2000); } window.onfocus = function(){ if(timer) cleartimeout(timer); } function changeitup(){ if( has_switched == false ){ alert('the tab lost focus') has_switched = true; } } })(); 

onblur属性可用于在窗口上设置模糊处理程序,当窗口失去焦点时会触发该模糊处理程序。

我有这个

 $(function() { $(window) .focus(function() { document.getElementById('play_banner').value = true; }) .blur(function() { document.getElementById('play_banner').value = false; }) }) 

在IE,firefox和chrome上工作正常,当play_banner设置为true时横幅只有动画,所以当用户更改页面时它停止工作,当他回来时它继续从它的位置…

如果您不关心在iframe中捕获鼠标事件,可以将此css添加到iframe元素:

 pointer-events:none; 

这指示鼠标事件“穿过”元素并且目标是“该元素”下面的任何内容。

但请注意,浏览器之间的此function兼容性可能会受到限制,即使实现它的人也可能会有所不同。 这个声明被推迟到CSS4草案,因为它在各种浏览器实现中存在大量问题(根据MDN – 在这里阅读更多内容: https : //developer.mozilla.org/en/CSS/pointer-events )

我认为您可以使用以下内容来禁用该行为。

 $('iframe').focusin(function(event) { event.preventDefault(); return false; }); 

您可以使用类似的东西来检测浏览器事件。

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

来源post

我刚刚解决了这个问题。 我需要计算用户在每个页面上花费的时间。

之前的实现是这样的:

 var isfocused = true var time_on_page = 0; function increment_time(){ if(isfocused = true){ time_on_page++; } } settimeout(increment_time, 1000); function _blur(){ isfocused = false } function _focus(){ isfocused = true } $(window).blur(_blur) $(window).focus(_focus) 

然后我遇到了同样的问题:每当用户输入iframe时,它就会停止计算时间。 我做的是听儿童iframe身体的焦点和模糊事件,如下所示:

 var isfocused = true var time_on_page = 0; function increment_time(){ if(isfocused = true){ time_on_page++; } instrument_iframes(); //because iframes might be added later to the dom with javascript } settimeout(increment_time, 1000); function _blur(){ isfocused = false; } function _focus(){ isfocused = true; } function instrument_iframes(){ var iframes = $('iframe'); for (var i=0; i 

使用此设置,当用户输入iframe时,浏览器将调用_blur()然后调用_focus(),以便计时器不会停止。

这可能不是您想要的,但根据问题,它可能是一个可接受的解决方案。 它适用于我的用例:-)