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

发布于 2024-11-17 14:58:39 字数 126 浏览 0 评论 0原文

如果用户位于实际选项卡/页面上,javascript 是否可以仅执行 javascript?

就像如果他切换到另一个选项卡,那么 javascript 进程将暂停,当他返回到该选项卡时,javascript 将继续该进程。

Is it possible in javascript to only execute javascript if the user is on the actual tab/page?

Like if he switches to another tab then the javascript process will be paused and when he returns to the tab the javascript will continue the process.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

奈何桥上唱咆哮 2024-11-24 14:58:39

除非您使用特定于浏览器的代码或不完全标准的代码(请参阅 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);
}

There is no direct way unless you use browser-specific code, or code that's not completely standard (see katspaugh's answer).

'Stop' solution

  • design your code so that it is "stoppable". That's something you have to figure out for your context.

  • Then add something like below:

..

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

</body> 
</html> 

'Assert' solution

Insert the following code where it really matters that the window has focus:

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

There are different methods for testing if window has focus: JavaScript / jQuery: Test if window has focus

Asyncronous solution

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

One of two possible implementations exist.....

Waiting via setTimeout

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

Waiting via custom events

Or even better, if you can wrap the window-focused-dependent functionality (the functionality dependent on the window having focus) into a separate function, then "hook" that function to window.onfocus. Be careful with this one though. You don't wan't to completely overwrite the window.onfocus function (or you undo the previous work you just did). Instead, you may have to use custom events of some sort. Most js frameworks provide custom events. If you go this route, the window.onfocus function will simply trigger some custom event, and you don't have to manually writing any looping code with 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);
}
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文