页面可见性改变事件

// 设置隐藏属性和改变可见属性的事件的名称
var hidden, visibilityChange;
if (typeof document.hidden !== "undefined") { // Opera 12.10 and Firefox 18 and later support
hidden = "hidden";
visibilityChange = "visibilitychange";
} else if (typeof document.msHidden !== "undefined") {
hidden = "msHidden";
visibilityChange = "msvisibilitychange";
} else if (typeof document.webkitHidden !== "undefined") {
hidden = "webkitHidden";
visibilityChange = "webkitvisibilitychange";
}

 

 

 

//*********************************************************************************************//

 

 

// 如果浏览器不支持addEventListener 或 Page Visibility API 给出警告
if (typeof document.addEventListener === "undefined" || typeof document[hidden] === "undefined") {
console.log(
"This demo requires a browser, such as Google Chrome or Firefox, that supports the Page Visibility API.");
} else {
// 处理页面可见属性的改变
document.addEventListener(visibilityChange, function() {
console.log(document.visibilityState);
//页面显示时document.visibilityState值为visible，隐藏显示时document.visibilityState值为hidden，
//或者
document.title = document[hidden] ? '离开这个页面了' : '又回到这个页面了';
//这个是判断document.hidden，页面的隐藏状态

}, false);
}