检测窗口是否可见

Question

我有一个基于Web的仪表板，向医院楼层的护士等人员显示关键的时间敏感信息。挑战在于，如果仪表板没有打开或最小化，他们将无法看到消息并做出响应。我目前跟踪应用程序运行的时间百分比（它每10秒通过AJAX轮询新消息，因此我可以轻松地查看它每小时或其他时间段的请求数），但这并不能告诉我应用程序是否已最小化。

一种方法是使用onfocus/onblur，但由于部署此方法的大多数计算机都是双屏幕计算机，他们通常会在一台屏幕上保持仪表板处于打开状态，而在另一台屏幕上使用临床信息系统。这种状态将被视为“非焦点”使用焦点/模糊方法，但我希望它在我的统计中被视为“打开”。

有没有检测窗口可见性的想法？我在考虑可能包含一个微小的Flash“像素”，并检测它是否可见 - 还有其他想法吗？

- Michael Kopinsky

---

有没有比onfocus/onblur更好的方法在IE <10中工作？ - Michael Kopinsky

Answer 1

在支持的浏览器中，您可以使用页面可见性API。否则，如你所说，你将需要使用onfocus/onblur的hack。

visibility.js是一个库，可以在所有浏览器中进行抽象化处理。如果浏览器不支持页面可见性API，它将使用onblur/onfocus的hack。

function isPageHidden(){
     return document.hidden || document.msHidden || document.webkitHidden || document.mozHidden;
 }

来源: http://www.nczonline.net/blog/2011/08/09/introduction-to-the-page-visibility-api/

阅读: https://developer.mozilla.org/en-US/docs/DOM/Using_the_Page_Visibility_API

- Adam

---

这对于现代浏览器来说非常棒。不幸的是，我的医院仍然停留在IE7上-在我几周前进行的一项测量中，84％的流量来自旧的IE，10％火狐，7％Chrome。所以我可能会使用页面可见性来获得更好的17％统计数据，但我想我必须为IE用户使用onfocus/onblur。 - Michael Kopinsky

你可以使用 visibility.js 并获取它们所有的内容。 - Adam

你能说服你的用户在IE的基础上安装Chrome Frame吗？ - Adam

visibility.js 实际上会为旧浏览器添加功能吗？还是只是悄悄地降级了呢？ - Michael Kopinsky

鼓励使用Chrome或Chrome Frame是一种选择，但可能会引发与IT部门的政治问题。我们不想走这条路。 - Michael Kopinsky

如果document.hidden不是未定义的，则此代码将尝试document.msHidden等，最终对于非Mozilla浏览器返回undefined而不是false。 - HelloWorld