大家好，又见面了，我是你们的朋友全栈君。
1. 项目中，从一个页面进入到另一个页面，然后在这个页面做一些修改后返回到第一个页面，这个时候第一个页面没有刷新只类似tab切换，所以用户的修改未生效。使用html的浏览器事件 visibilitychange
2. 此事件已经得到了广泛应用，但是一些老版本的浏览器需要加相应的前缀
3. 微信内置的浏览器因为没有标签，所以不会触发该事件
手机端直接按Home键回到桌面，也不会触发该事件
PC端浏览器失去焦点也不会触发该事件，但是最小化回到桌面会触发
4. 定义有两个只读的document属性: hidden和visibilityStat
document.hidden是一个布尔值，简单的表示标签页显示或者隐藏(隐藏包括页面在后台标签页中或者浏览器最小化，但是不包括被其他软件比如打开的sublime遮盖)
document.visibilityState属性更详细，有四个值
=》visible: 页面在前台标签中
=》hidden: 页面在后台标签页或者浏览器最小化
=》uploaded: 页面正在从内存中卸载
=》prerender: 页面在屏幕外执行预渲染处理,document.hidden的值为true
function getHiddenProp(){ var prefixes = ['webkit','moz','ms','o']; // if 'hidden' is natively supported just return it if ('hidden' in document) return 'hidden'; // otherwise loop over all the known prefixes until we find one for (var i = 0; i < prefixes.length; i++){ if ((prefixes[i] + 'Hidden') in document) return prefixes[i] + 'Hidden'; } // otherwise it's not supported return null; } function getVisibilityState() { var prefixes = ['webkit', 'moz', 'ms', 'o']; if ('visibilityState' in document) return 'visibilityState'; for (var i = 0; i < prefixes.length; i++) { if ((prefixes[i] + 'VisibilityState') in document) return prefixes[i] + 'VisibilityState'; } // otherwise it's not supported return null; } function isHidden() { var prop = getHiddenProp(); if (!prop) return false; return document[prop]; } var visProp = getHiddenProp(); if (visProp) { var evtname = visProp.replace(/[H|h]idden/, '') + 'visibilitychange'; document.addEventListener(evtname, function () { document.title = document[getVisibilityState()]+"状态"; },false); }
转载于:https://www.cnblogs.com/lindsayzhao103011/p/8884418.html
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请联系我们举报，一经查实，本站将立刻删除。
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/148461.html原文链接：https://javaforall.net
