如何判断浏览器/选项卡是否处于活动状态
可能重复：
有没有办法来检测浏览器窗口是否目前不活动？
我有一个函数，每秒钟我只想运行，如果当前页面在前台，即用户没有最小化浏览器或切换到另一个选项卡。 如果用户没有看到它，并且可能是CPU密集型的，那么它就没有任何用处，所以我不想在后台浪费周期。
有谁知道如何在JavaScript中告诉这个？
注意：我使用jQuery，所以如果你的答案使用了，那很好:)。
您将使用窗口的focus和blur事件：
var interval_id; $(window).focus(function() { if (!interval_id) interval_id = setInterval(hard_work, 1000); }); $(window).blur(function() { clearInterval(interval_id); interval_id = 0; });
回答“双火”的评论问题，并保持在jQuery的易用性：
$(window).on("blur focus", function(e) { var prevType = $(this).data("prevType"); if (prevType != e.type) { // reduce double fire issues switch (e.type) { case "blur": // do work break; case "focus": // do work break; } } $(this).data("prevType", e.type); })
点击查看示例代码显示工作（JSFiddle）
除了RichardSimões的回答，您还可以使用页面可见性API 。
if (!document.hidden) { // do what you need }
本规范为网站开发人员定义了一种方法，以编程方式确定页面的当前可见性状态，以便开发功耗和CPU高效的Web应用程序。
学到更多
- http://davidwalsh.name/page-visibility
- https://developers.google.com/chrome/whitepapers/pagevisibility
例
我会尝试在window.onfocus和window.onblur事件上设置一个标志。
以下片段已在Firefox，Safari和Chrome上进行testing，打开控制台并在标签之间来回切换：
var isActive; window.onfocus = function () { isActive = true; }; window.onblur = function () { isActive = false; }; // test setInterval(function () { console.log(window.isActive ? 'active' : 'inactive'); }, 1000);
试试看。
使用jQuery：
$(function() { window.isActive = true; $(window).focus(function() { this.isActive = true; }); $(window).blur(function() { this.isActive = false; }); showIsActive(); }); function showIsActive() { console.log(window.isActive) window.setTimeout("showIsActive()", 2000); } function doWork() { if (window.isActive) { /* do CPU-intensive stuff */} }
这里的所有例子（除了rockacola's）都要求用户在窗口上点击来定义焦点。 这并不理想，所以.hover()是更好的select：
$(window).hover(function(event) { if (event.fromElement) { console.log("inactive"); } else { console.log("active"); } });
这会告诉你什么时候用户把鼠标放在屏幕上，尽pipe它不会告诉你它是否在用户的鼠标的前台。
如果您尝试在Chrome中打开某些与Googlesearch页面类似的内容（在页面上“关注”某个事件时触发），那么hover（）事件可能会有所帮助。
$(window).hover(function() { // code here... });
