浏览器标签tab窗口切换时事件状态侦听
做到 是大屏项目,用的websocket,在浏览器切换标签窗口后,过了一段时间回来,页面会非常卡,所以想页面切回来的时候刷新页面,找到了这个方法,这是原来的例子。这段代码可以自己复制去做下测试
var normal_title;
document.addEventListener('visibilitychange',function(){ //浏览器切换事件
if(document.visibilityState=='hidden') { //状态判断
normal_title=document.title;
document.title='隐藏的标题';
}else {
document.title=normal_title;
}
});
下面是我项目中的
document.addEventListener('visibilitychange',function(){
if(document.visibilityState=='hidden') {
if(ws){
ws.close(); //关闭websocket
}
}else {
location.reload(); //刷新页面
}
});
浏览器标签tab窗口切换时事件状态侦听的更多相关文章
- js监听浏览器tab窗口切换
js监听浏览器tab窗口切换 ——IT唐伯虎 摘要:js监听浏览器tab窗口切换. if (document.hidden !== undefined) { document.addEventLis ...
- selenium WebDriver 对浏览器标签页的切换
关于selenium WebDriver 对浏览器标签页的切换,现在的市面上最新的浏览器,当点击一个链接打开一个新的页面都是在浏览器中打开一个标签页,而selenium只能对窗口进行切换的方法,只能操 ...
- dataTable tab栏切换时错位解决办法
做后台管理类网站肯定要写列表,首选dataTable,功能强大 最近在做一个tab栏切换时发现了一个很诡异的事情:表头错位了! 主要时因为当table被隐藏后,table的header宽度会计算错乱, ...
- 关于饿了么在浏览器标签页失去焦点时网页Title改变的实现方法
说在前面:必须是基于支持H5的浏览器才可以 这个 API 本身非常简单,由以下三部分组成. document.hidden:表示页面是否隐藏的布尔值.页面隐藏包括 页面在后台标签页中 或者 浏览器最小 ...
- Fragment实现底部Tab,切换可保存状态
activity_main.xml <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android& ...
- Laravel 事件侦听的几个方法 [Trait, Model boot(), Observer Class]
1 Trait 1.1 可以在 Trait 中定义一个静态的 bootFooBar() 方法,注:FooBar 是你的 Trait 名称 namespace App\Traits; use App\A ...
- vue -vantUI tab切换时 list组件不触发load事件解决办法
最近由于公司项目需要,用vue写了几个简单的页面.用到了vantUI List 列表 瀑布流滚动加载,用于控制长列表的展示 当列表即将滚动到底部时,会触发事件并加载更多列表项. (页面加载完成后默认会 ...
- js基础--浏览器标签页隐藏或显示状态 visibility详解
欢迎访问我的个人博客:http://www.xiaolongwu.cn 前言 在工作中我们可能会遇到这样的需求,当浏览器切换到别的标签页或着最小化时,我们需要暂停页面上正在播放的视频或者音乐,这个需求 ...
- (转)js控制窗口失去焦点(包括屏蔽Alt+Tab键切换页面)
本章内容转自:http://www.cnblogs.com/BoKeYuanVinson/articles/3360954.html 转载自网络贴吧: 页面脚本是无法截获alt键的,不过可以变通一下, ...
随机推荐
- java树形结构工具类
一.树形结构数据一般都是以子父id的形式存在数据库中,查询的时候只是带有子id和parent_id的List集合 并不是树形结构,所以我们现在要将普通的List集合转换为树结构数据(本工具类扩展操作树 ...
- GDB 调试指南
本文首发于我的公众号 Linux云计算网络(id: cloud_dev),专注于干货分享,号内有 10T 书籍和视频资源,后台回复 「1024」 即可领取,欢迎大家关注,二维码文末可以扫. 00 介绍 ...
- C++类拷贝控制 深拷贝 浅拷贝
普通类型对象之间的复制很简单,而类对象与普通对象不同,类对象内部结构一般较为复杂,存在各种成员变量,这篇文章将帮你理清C++类对象的拷贝方式 拷贝构造函数,拷贝赋值运算符 首先我们简单了解下默认的拷贝 ...
- python接口测试(post,get)-传参(data和json之间的区别)
python接口测试如何正确传参: POST 传data:data是python字典格式:传参data=json.dumps(data)是字符串类型传参 #!/usr/bin/env python3 ...
- [Pandas] 01 - A guy based on NumPy
主要搞明白NumPy“为什么快”. 学习资源 Panda 中文 易百教程 远程登录Jupyter笔记本 效率进化 四步效率优化 NumPy 底层进行了不错的优化. %timeit 对于任意语句,它会自 ...
- Redis专题(3):锁的基本概念到Redis分布式锁实现
拓展阅读:Redis闲谈(1):构建知识图谱 Redis专题(2):Redis数据结构底层探秘 近来,分布式的问题被广泛提及,比如分布式事务.分布式框架.ZooKeeper.SpringCloud等等 ...
- JQuery学习笔记之手网琴效果
这种东西在网上多的是,最近在学JQuery,所以就写了个随笔 <!DOCTYPE html> <html lang="en"> <head> & ...
- Airflow自定义插件, 使用datax抽数
Airflow之所以受欢迎的一个重要因素就是它的插件机制.Python成熟类库可以很方便的引入各种插件.在我们实际工作中,必然会遇到官方的一些插件不足够满足需求的时候.这时候,我们可以编写自己的插件. ...
- 阿里云服务器CentOS6.9 tomcat配置https安全访问
应用场景 上线微信小程序的时候,域名要求https安全格式,否则获取数据异常. 第一步.SSL证书获取 获取SSL证书方式很多种,包括网页生成.工具生成等,这里我使用阿里云平台获取免费ssl证书的方法 ...
- JavaScript实现各种排序算法
前言:本文主要是用JavaScript实现数据结构中的各种排序算法,例如:插入排序.希尔排序.合并排序等. 冒泡排序 function bubbleSort(arr) { console.time(& ...