公司做mifi设备,ui界面很多信息需要1S钟不断异步请求更新信息,如果同时打开多个浏览器或者多个当前界面,设备1S钟会收到很多个请求,由于设备本身内存限制,会导致响应速度过慢,且会造成设备重启等。

所以需要我们只对停在当前界面的页面请求进行处理,其他切换掉的界面不再下发请求。

这方面的应用还有切换或最小化视频页面暂停播放,打开当前页签视频继续播放等。

页签切换或触发浏览器的 visibilitychange 事件

window.addEventListener("visibilitychange",function(){

  console.log(document.hidden)

});

判断当前页面是否切换为可见:

1)document.hidden

  返回值为true:表示被隐藏,不可见

  返回值为false:表示未被隐藏,可见

2)document.visibilityState

  返回值有 visible:表示是可见状态

  返回值为 hidden:表示隐藏状态

全过程代码,如下,(参考张鑫旭博客)

js判断当前浏览器页面是否切换的更多相关文章

  1. 360极速浏览器UA怪异以及如何用js判断360浏览器

    本文最后一次更新于7个月前,文章内容可能略有出入.若发现文章中有错误之处,可以留言评论告诉作者. 1.360极速浏览器UA因域名不同而异 今天在写一个判断浏览器.浏览器版本.操作系统.操作系统版本.浏 ...

  2. 笔记:1.css样式,最前边加 @charset "utf-8";是为什么2.js判断各种浏览器的方法

    表明CSS文件的页面编码为UTF-8..如果这个CSS的文件编码也是UTF-8的话..那么在浏览器中看到的CSS文件的页面中中文的注释或者中文字体就可以正确显示为中文,如果CSS的文件编码和页面不一致 ...

  3. js监听浏览器tab窗口切换

    js监听浏览器tab窗口切换 ——IT唐伯虎 摘要:js监听浏览器tab窗口切换. if (document.hidden !== undefined) {  document.addEventLis ...

  4. 通过JS判断当前浏览器的类型

    通过JS判断当前浏览器的类型,对主流浏览器Chrome.Edge.Firefox.UC浏览器.QQ浏览器.360浏览器.搜狗浏览器的userAgent属性值来判断用户使用的是什么浏览器. 不同浏览器的 ...

  5. js判断用户关闭页面或浏览器

    <html><head><meta http-equiv="Content-Type" content="text/html; charse ...

  6. js判断移动端页面按home键切换到桌面事件

    ---恢复内容开始--- 原理就是通过页面标签切换事件(visibilitychange)来判断,亦可用户移动端桌面和app切换. 先看代码: var hiddenProperty = 'hidden ...

  7. js 判断微信浏览器(转)

    最近做很多HTML5的项目,很多页面会通过微信微博等SNS分享出去.在分享页面上提供公司APP的下载.但是在很多应用的浏览器中,点击下载链接无法下载应用.那么针对这些浏览器我们需要给用户提示从safa ...

  8. js判断当前浏览器是pc端还是移动端

    根据用户的访问设备的不同来显示不同的页面样式,主要是判断移动设备还是电脑浏览器访问的. 下面给出js判断处理代码,以作参考. <script type="text/javascript ...

  9. js判断手机浏览器操作系统和微信浏览器的方法

    做手机端的前端开发,少不了对手机平台的判断.如,对于app下载,就要判断在Android平台下就显示Android下载提示:在iOS平台下就显示iOS下载提示. 今天就为大家介绍一下用js判断手机客户 ...

随机推荐

  1. Python之给程序传参数

    1.代码 import sys # 导入系统 args = sys.argv # 获取系统参数 if(args.__len__() == 2): print("%s是世界上最好的语言!&qu ...

  2. MySQL 5.6.20-enterprise-commercial的参数文件位置问题

    今天在折腾MySQL的参数文件时,突然发现MySQL 5.6.20-enterprise-commercial-advanced-log这个版本数据库的参数文件my.cnf的位置有点奇怪,如下所示: ...

  3. 自动化测试基础篇--Selenium等待时间

    摘自https://www.cnblogs.com/sanzangTst/p/8376221.html 当你觉得你的定位没有问题,但是却直接报了元素不可见,那你就可以考虑是不是因为程序运行太快或者页面 ...

  4. 二、selenium 安装

    selenium的安装所需要的环境: 1.浏览器的安装Firefox 2.JDK的安装(Java开发基础类库)eclipse 一个开发源代码的工具 3.selenium sever 下载.网络状况监视 ...

  5. Turtle绘制带颜色和字体的图形(Python3)

    转载自https://blog.csdn.net/wumenglu1018/article/details/78184930 在Python中有很多编写图形程序的方法,一个简单的启动图形化程序设计的方 ...

  6. RPM包的版本号比较

    版本号表示格式为 epoch:version-release,例如 1:2-3 第一条原则是 rpm 属性优先级 epoch > version > release        两个 r ...

  7. LeetCode算法题-Word Pattern(Java实现)

    这是悦乐书的第202次更新,第212篇原创 01 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第68题(顺位题号是290).给定一个模式和一个字符串str,找到str是否完全匹配该模 ...

  8. python 类与类之间的关系

    一.依赖关系(紧密程度最低) (1)简单的定义:就是方法中传递一个对象.此时类与类之间存在依赖关系,此关系比较低. (2)实例植物大战僵尸简易版 题目要求:创建一个植物,创建一个僵尸 1.植物:名字. ...

  9. linux历史命令查找快捷方式

      一.回到上次操作的目录# cd -进入上次访问目录 二.历史命令搜索操作快捷键:[Ctrl + r], [Ctrl + p], [Ctrl + n] 在终端中按捉 [Ctrl] 键的同时 [r] ...

  10. zabbix全网监控

    为什么要监控 运维的职责1.保障企业数据的安全可靠.2.为客户提供7*24小时服务.3.不断提升用户的体验. 在关键时刻,提前提醒我们服务器要出问题了 当出问题之后,可以便于找到问题的根源 拿到公司服 ...