转:https://blog.csdn.net/yusirxiaer/article/details/73480916

又看到一个很有意思的HTML5事件

visibilitychange事件是浏览器新添加的一个事件,当浏览器的某个标签页切换到后台,或从后台切换到前台时就会触发该消息,现在主流的浏览器都支持该消息了,例如Chrome, Firefox, IE10等。虽然这只是一个简单的功能,但是能够广大的采用HTML5开发游戏的开发者提供方便,比如用户正在玩游戏时,突然切换到后台去发一条短信或打一个电话,再切换到游戏,那么开发者就需要捕捉对这些突发情形进行处理,当游戏切换到后台时就暂停游戏,从后台切换回来时,又能允许用户继续游戏。

通过document的hidden属性可以判断标签是否可见。true时代表标签不可见。 
这个事件适合在标签不可见的时候减少网络请求、服务器压力等,也可以做一些好玩的事情,比如改变网页标题的文字。

 document.addEventListener("visibilitychange", function(){
document.title = document.hidden ? "用户离开了" : "用户回来了";
});

HTML5事件—visibilitychange 页面可见性改变事件的更多相关文章

  1. 页面可见性改变事件 : visibilitychange 详解

    1.Page Visibility API标准概述 查看W3C的官方文档时候看到这个属性 标准时间线是这样介绍的: Page Visibility Level 2 W3C Proposed Recom ...

  2. JS事件 文本框内容改变事件(onchange)通过改变文本框的内容来触发onchange事件,同时执行被调用的程序。

    文本框内容改变事件(onchange) 通过改变文本框的内容来触发onchange事件,同时执行被调用的程序. 如下代码,当用户将文本框内的文字改变后,弹出对话框"您改变了文本内容!&quo ...

  3. 【转】HTML5 API --- 页面可见性改变(visibilitychange)事件

    [摘要:[本文属本创,若有转载,请说明出处http://blog.csdn.net/yl02520/article/] visibilitychange事情是扫瞄器新增加的一个事情,当扫瞄器的某个标签 ...

  4. 拥抱HTML5 — Page Visibility(页面可见性) API介绍

    H5 提供了很多简单实用的 API,Page Visibility API 就是其中之一. 不知道用户是不是在与页面交互,这是困扰广大 Web 开发人员的一个主要问题.如果 页面最小化了 或者 隐藏在 ...

  5. jQuery中的bind绑定事件与文本框改变事件的临时解决方法

    暂时没有想到什么好的解决办法,我现在加了个浏览器判断非ie的话就注册blur事件,这样有个问题就是blur实在别的控件活动焦点的时候,txtStation控件注册的方法是为了填充它紧挨着的一个下拉列表 ...

  6. JS监听input框的回车事件、属性值改变事件

    一.介绍 在程序猿门的工作中,经常会遇见一些表单数据的提交,对于有表单的东西而言,input输入框是非常常见的,所以对于一些input的基本事件,我们需要去掌握 二.input的监听enter事件 比 ...

  7. Page Visibility(页面可见性) API介绍、微拓展[转]

    一.网页君的悲情谁来懂 唉,突然想到了一首悲情诗: 泪湿罗巾梦不成,夜深前殿按歌声.红颜未老恩先断, 斜倚薰笼坐到明. 学生时代学过的一首诗,已还给老师不知所云的诸位可参见下面释义: 诗的主人公是一位 ...

  8. python 全栈开发,Day55(jQuery的位置信息,JS的事件流的概念(重点),事件对象,jQuery的事件绑定和解绑,事件委托(事件代理))

    一.jQuery的位置信息 jQuery的位置信息跟JS的client系列.offset系列.scroll系列封装好的一些简便api. 一.宽度和高度 获取宽度 .width() 描述:为匹配的元素集 ...

  9. 页面可见性判断:document.hidden与visibilitychange事件

    我们需要在特定的时候判断页面的显示状态,例如:当视频加载到可播放状态时,根据用户是否停留在当前页面来决定是否开始自动播放.页面的展示的状态的判断就需要用到html5新增的一个api:document. ...

随机推荐

  1. 最短路算法--SPFA+嵌套map

    hdu 2066   #include<iostream> #include<cstdio> #include<cstring> #include<queue ...

  2. 键盘监听事件KeyListener

    说明:按下实体按键,相应虚拟按键变绿色,释放按键,变白色.   public class Demo extends JFrame { private List<JButton> list; ...

  3. 20145215《网络对抗》Exp9 Web安全基础实践

    20145215<网络对抗>Exp9 Web安全基础实践 基础问题回答 SQL注入攻击原理,如何防御? SQL注入攻击就是通过把SQL命令插入到Web表单递交或输入域名或页面请求的查询字符 ...

  4. 面向对象【day08】:反射(五)

    本节内容 概述 反射函数 综合使用 一.概述 反射我们以后会经常用到,这个东西实现了动态的装配,通过字符串来反射类中的属性和方法 二.反射函数 2.1 hasarttr(obj,name_str) 作 ...

  5. MapReduce与关系型数据库的不同之处。

    MapReduce能够被视为RDBMS(关系型数据库)的补充. 1.MapReduce适合处理那些需要分析整个数据集的问题(日志分析等),以批处理的方式.RDBMS适合做点查询和更新. 2.MapRe ...

  6. 6、Python-元组

    定义 # Python的元组与列表类似,不同之处在于元组的元素不能修改.元组使用小括号,列表使用方括号. aTuple = ('et',77,99.9) print(aTuple) 元组的操作 aTu ...

  7. 在windows环境下实现开机延迟启动tomcat

    如果说我们的服务器断电了 开机之后还需要手动开下服务  还需要远程连接上  然后一个一个开启  是不是很麻烦  我们可以写一个bat脚本  然后设置开机5分钟之后启动tomcat 首先配置环境变量: ...

  8. idea 插件的使用 进阶篇(个人收集使用中的)

    idea 插件的使用 进阶篇(个人收集使用中的) 恭喜你,如果你已经看到这篇文章,证明在idear使用上已经初有小成!那么就要向着大神进发了! 下边就是大神之路! 插件的设置 在 IntelliJ I ...

  9. ubuntu18虚拟机克隆之后ip相同的解决方案

    最近使用虚拟机装ubuntu18.04,克隆后发现ip是相同的,应为克隆采用的是文件克隆,所以所有的东西都一样.解决最简单的方法就是修改mac然后启动使用netplan apply命令,重启reboo ...

  10. luogu P3674 小清新人渣的本愿

    传送门 毒瘤lxl 本质是莫队,关键是怎么处理询问 这里需要开两个bitset(记为\(b1,b2\)),分别存\(x\)和\(n-x\)是否出现 对于询问1,即\(x-y=z\),由于\(y=x-z ...