js基础--如何判断浏览器标签页是隐藏或者显示状态
2018-03-27 19:06
465 查看
欢迎访问我的个人博客:http://www.xiaolongwu.cn
document.visibilityState
document.hidden
visibilitychange
上面代码中:
- document.visibilityState有两个值,分别为hidden和visible,hidden表示标签页被隐藏了,visible则反之;
- document.hidden也有两个值,分别为true和false,true表示标签页被隐藏了,false则反之;
我的个人博客:http://www.xiaolongwu.cn
如果您对我的博客内容有疑惑或质疑的地方,请在下方评论区留言,或邮件给我,共同学习进步。
邮箱:wuxiaolong802@163.com
前言
在工作中我们可能会遇到这样的需求,当浏览器切换到别的标签页或着最小化时,我们需要暂停页面上正在播放的视频或者音乐,这个需求就会用到我下面要说的这个知识点:document.visibilityState
document.hidden
visibilitychange
具体用法
浏览器标签页隐藏或者显示时会改变document.visibilityState和document.hidden的值,我们可以通过visibilitychange这个事件去监听他们状态值的变化;// 我在这里建议大家亲自试试以下代码 document.addEventListener("visibilitychange", function() { console.log( document.visibilityState ); console.log(document.hidden); });
上面代码中:
- document.visibilityState有两个值,分别为hidden和visible,hidden表示标签页被隐藏了,visible则反之;
- document.hidden也有两个值,分别为true和false,true表示标签页被隐藏了,false则反之;
我的个人博客:http://www.xiaolongwu.cn
如果您对我的博客内容有疑惑或质疑的地方,请在下方评论区留言,或邮件给我,共同学习进步。
邮箱:wuxiaolong802@163.com
相关文章推荐
- 将鼠标放在A标签上时浏览器左下角会显示跳转后界面地址,如何隐藏
- jquery或js如何判断一个层是显示还是隐藏
- jquery 如何判断一个元素当前状态是隐藏或显示
- js如何将一个按钮显示或者隐藏
- 如何使用PHP或者js判断当前是微信浏览器访问
- js判断全选反选 多选选中状态隐藏显示div
- 如何让某些标签显示或者隐藏起来
- [JS代码]如何判断ipad或者iphone是否为横屏或者竖屏 - portrait或者landscape
- 如何用js来判断浏览器类型(ie,firefox)等等
- 如何用JS实现一个DropDownList的值改变时触发另一个DropDownList的显示与隐藏
- 如何对浏览器进行判断,并设制标签属性
- [JS代码]如何判断ipad或者iphone是否为横屏或者竖屏 - portrait或者lan...
- 对于dbgrideh如何动态隐藏或者显示列
- 不用JS实现显示隐藏效果(兼容各浏览器)
- jQuery显示和隐藏 常用的状态判断方法
- jquery教程:仿miqike.com首页"热门标签"层绝对定位 点击隐藏/点击显示JS效果
- 如何使用js动态显示或隐藏DIV
- js对<span>标签隐藏显示操作
- 如何利用js 控制 页面元素的隐藏显示
- 用JS的正则表达式如何判断输入框内为中文或者是英文数字,或者是三者混编_乱码...