javascript - 如何使用 Javascript 在 Chrome 中检测选项卡何时聚焦或不聚焦？

Question

我需要知道用户当前是否正在查看 Google Chrome 中的标签。我尝试使用事件 blur 和 focus 绑定(bind)到窗口，但似乎只有 blur 可以正常工作。

window.addEventListener('focus', function() {
  document.title = 'focused';
});

window.addEventListener('blur', function() {
  document.title = 'not focused';
});

焦点事件的工作很奇怪，只是有时。如果我切换到另一个选项卡并返回，焦点事件将不会激活。但如果我点击地址栏然后返回页面，它就会。或者，如果我切换到另一个程序然后返回到 Chrome，如果该选项卡当前处于焦点状态，它将激活。

Answer 1

2015 年更新:具有可见性 API 的新 HTML5 方式(摘自 Blowsie 的评论):

document.addEventListener('visibilitychange', function(){
    document.title = document.hidden; // change tab text for demo
})

---

截至 2011 年，原始发帖人(在问题中)给出的代码现在可以使用:

window.addEventListener('focus', function() {
    document.title = 'focused';
});

window.addEventListener('blur', function() {
    document.title = 'not focused';
});

编辑:在几个月后的 Chrome 14 中，这仍然有效，但用户必须至少通过在窗口中的任意位置单击一次来与页面进行交互。仅仅滚动等不足以完成这项工作。执行 window.focus() 也不会自动完成这项工作。如果有人知道解决方法，请提及。