html5 Visibility API

html5 Visibility API
这个 API 为我们带来了两个 document 上的属性,document.visibilityState 和document.hidden, 这个两个属性实现了不同的功能。
document.visibilityState 有四个不同的值:
hidden:页面不可见

prerender:页面在后台加载的,对用户不可见

visible:页面可见

unloaded:页面即将关闭(用户正在从当前页面跳转到其他页面)

document.hidden 是一个布尔属性,页面可见是为 false,页面不可见时为 true。
有时候tab大于1个,需要用一个全局的变量来表示,可以使用localStorage。在页面初始化的时候,先将localStorage中的对应变量要先更改到可见,然后在状态变化时
document.addEventListener('visibilitychange',function(event){

if(document.visibilityState != 'visible') {
$localStorage.agroup.hidden = true;
}else {
$localStorage.agroup.hidden = false;
}

});

推荐阅读更多精彩内容