JavaScript / JQuery仅在页面焦点上执行JavaScript

Question

JavaScript / JQuery仅在页面焦点上执行JavaScript

javascriptprocessexecution

3

在 JavaScript 中，是否可以仅在用户位于实际标签/页面上时执行 JavaScript 代码？

比如，如果他切换到另一个标签页，则 JavaScript 进程将暂停，当他返回到该标签页时，JavaScript 将继续执行。

- Tomkay

首先，问问自己如何停止执行页面中的 JavaScript？ - wong2

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Alexander Bird · Accepted Answer

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

'停止'方案

设计您的代码使其可以“停止”。这是您必须为您的上下文考虑的事情。
然后添加以下内容：

..

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

</body> 
</html>

'断言'解决方案

在确保窗口已获得焦点的位置插入以下代码:

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

有不同的方法来测试窗口是否拥有焦点：JavaScript / jQuery：测试窗口是否拥有焦点

异步解决方案

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);
}