正文

JavaScript 判断是否在当前标签页

不支持 IE 浏览器

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
// 判断是否在当前标签页 
let hidden, state, visibilityChange;
if (typeof document.hidden !== "undefined") {
  hidden = "hidden";
  visibilityChange = "visibilitychange";
  state = "visibilityState";
} else if (typeof document.mozHidden !== "undefined") {
  hidden = "mozHidden";
  visibilityChange = "mozvisibilitychange";
  state = "mozVisibilityState";
} else if (typeof document.msHidden !== "undefined") {
  hidden = "msHidden";
  visibilityChange = "msvisibilitychange";
  state = "msVisibilityState";
} else if (typeof document.webkitHidden !== "undefined") {
  hidden = "webkitHidden";
  visibilityChange = "webkitvisibilitychange";
  state = "webkitVisibilityState";
}
// 添加监听器，在 title 里显示状态变化 
document.addEventListener(
  visibilityChange,
  function() {
    if (document[state] === "visible") {
      document.title = " 回来啦！";
    } else {
      document.title = " 去哪了？";
    }
  },
  false
);
// 初始化页面状态 
document.title = " 回来啦！";

to be continued…