visibilitychange关于浏览器选项卡切换事件
visibilitychange 事件说明
visibilitychange 当其选项卡的内容变得可见或被隐藏时，会在文档上触发
visibilitychange(能见度更改)事件。
具体使用
document.addEventListener("visibilitychange", function() {if (document.visibilityState === 'visible') {// 浏览器选项卡可见} else {// 浏览器选项卡不可见}if (!document.hidden) {// 浏览器选项卡可见} else {// 浏览器选项卡不可见}
});
关于 visibilityState 说明
Document.visibilityState
（只读属性）, 返回document的可见性，典型用法是防止当页面正在渲染时加载资源, 或者当页面在背景中或窗口最小化时禁止某些活动。
visibilityState 可能的值
| 值 | 说明 |
|---|---|
| visible | 此时页面内容至少是部分可见. 即此页面在前景标签页中，并且窗口没有最小化 |
| hidden | 此时页面对用户不可见. 即文档处于背景标签页或者窗口处于最小化状态，或者操作系统正处于 ‘锁屏状态’ |
| prerender |
页面此时正在渲染中, 因此是不可见的 (considered hidden for purposes of document.hidden). 文档只能从此状态开始，永远不能从其他值变为此状态.注意: 浏览器支持是可选的（兼容性很差）
|
也有使用 document.hidden 来判断的
Document.hidden（只读属性）返回布尔值，表示页面是（true）否（false）隐藏。
visibilitychange关于浏览器选项卡切换事件相关推荐
- 浏览器中的标签切换事件
其实没什么好写的,逛知乎的时候突然断网了,于是我切换回小说标签页继续看没看完的小说,小说看得差不多了切回知乎的时候弹出一个错误提示,请原谅我的无聊,我来回切换十多次每次都弹出一个错误提示.我突然想知道 ...
- 浏览器Tab页切换事件
浏览器Tab页切换事件 /**** 浏览器Tab页切换事件*/ document.addEventListener('visibilitychange',function(){if(document. ...
- 监听浏览器tab切换
document.addEventListener('visibilitychange',function(){ //浏览器切换事件if(document.visibilityState=='hidd ...
- vue监听浏览器tab切换
vue监听浏览器tab切换 描述 监听tab切换浏览器页面,在离开当前页面和再次进来发生事件监听,类似与小程序的show函数 visibilitychange 详解 解决 created() {doc ...
- html监听页面关闭事件,JS针对浏览器窗口关闭事件的监听方法集锦
本文实例总结了JS针对浏览器窗口关闭事件的监听方法.分享给大家供大家参考,具体如下: 方式一:(适用于IE浏览器,而且刷新不提示,只在点击浏览器关闭按钮的时候提示) window.οnbefοreun ...
- 超好用的简单的jquery tab选项卡切换代码（点击切换和导航栏滑过）
实例1(点击切换): 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 ...
- selenium自动化测试_使用Selenium自动化测试处理多个浏览器选项卡
selenium自动化测试 使用Selenium进行自动化测试一直是将萌芽的自动化测试人员培养为专业人员的生命线. Selenium是开源的,在全球范围内被广泛采用. 结果,您会得到社区的大力支持. ...
- 使用Selenium自动化测试处理多个浏览器选项卡
使用Selenium进行自动化测试一直是将萌芽的自动化测试人员培养为专业人员的生命线. 硒是开源的,在全球范围内被广泛采用. 结果,您会得到社区的大力支持. 有多种用于不同语言的框架,这些框架提供与S ...
- Tab选项卡切换效果JavaScript汇总
tab切换在现在的网页上,真是十分的常用呀.但是tab切换的JavaScript实现却有很多需要注意的地方,如何用最少的代码,最灵活的实现.这里收集了37个tab实现的JavaScript代码,在此备 ...
最新文章
- POJ 1837 Balance（01背包变型）
- 使用百度地图实现详细地址自动补全
- nfs服务器工作原理
- n1运行linux,斐讯N1折腾记：运行 Linux 及优化
- linux vps 迁移数据 ip screen ctrl a d,Linux学习笔记之screen命令的使用
- SpringCloud(二) 生产者、消费者工程搭建与调用（下）
- 使用devops的团队_具有DevOps心态的团队的蓝图
- [教程]微信官方开源UI库-WeUI使用方法【申明：来源于网络】
- 初探asp.net异步编程之await
- 解决Scrapy抓取中文网页保存为json文件时中文不显示而是显示unicode的问题
- python安装与开发环境搭建实验总结_python开发环境安装配置
- 计算机安装软件没有管理员权限设置,实用技巧：如何在win10中安装没有管理员权限的软件...
- nvidia显卡驱动安装失败怎么办？
- 菜鸟必看IPC空连接的使用（转载）
- CTF Crypto---RSA NC不互素
- 火山PC自绘高级表格及超级列表框
- word点击退出时未保存怎么办？
- telegram 常见问题
- 2021-02-03-隐藏Tomcat版本号
- 单片机入门——单片机的基本构成及工作原理（1）