【问题标题】：Javascript/JQuery Execute Javascript Only On Page FocusJavascript/JQuery 仅在页面焦点上执行 Javascript
【发布时间】：2011-06-29 14:31:28
【问题描述】：

如果用户在实际的选项卡/页面上，是否可以在 javascript 中只执行 javascript？

如果他切换到另一个选项卡，则 javascript 进程将暂停，当他返回该选项卡时，javascript 将继续该进程。

【问题讨论】：

首先，问问自己如何在一个页面中停止执行JavaScript？

标签： javascript process execution

【解决方案1】：

除非您使用特定于浏览器的代码或不完全标准的代码（请参阅 katspaugh 的回答），否则没有直接的方法。

'停止'解决方案

设计您的代码，使其“可停止”。这是你必须根据你的情况弄清楚的事情。
然后添加如下内容：

<html> 
<head> 
</head> 
<body> 
    <script> 
    window.onblur = function() {
        yourStopFunctionHere().
    }
    </script> 

</body> 
</html>

'断言'解决方案

在窗口有焦点的地方插入以下代码：

if(windowHasFocus()) {
    //your code here
}

测试窗口是否有焦点有不同的方法：JavaScript / jQuery: Test if window has focus

异步解决方案

whenWindowHasFocus(fn); //where fn is the function you want to only run when window has focus

存在两种可能的实现之一.....

通过 setTimeout 等待

function WhenWindowHasFocus(yourFunction){
    if(windowHasFocus()) {
        yourFunction();
    }
    setTimeout(function(){ WhenWindowHasFocus(yourFunction); }, 1000);
}

通过自定义事件等待

或者更好的是，如果您可以将依赖于窗口的功能（依赖于具有焦点的窗口的功能）包装到一个单独的函数中，然后将该函数“挂钩”到 window.onfocus。不过要小心这个。您不想完全覆盖window.onfocus 函数（或者您撤消刚刚完成的先前工作）。相反，您可能必须使用某种自定义事件。大多数 js 框架都提供自定义事件。如果你走这条路，window.onfocus 函数将简单地触发一些自定义事件，你不必手动编写任何带有 setTimeout 的循环代码。

//The below is pseudo-code. custom events differ between js frameworks

window.onfocus = function(){
    window.FocusEvent.trigger()
}

function WhenWindowHasFocus(yourFunction){
    if(windowHasFocus()) {
        yourFunction();
    }
    window.focusEvent.addOnlyOnce(yourFunction);
}

【讨论】：

调用document.write() 可能不是一个好主意，因为它会清除页面:-)