监听微信手Q的挂起事件(visibilitychange)
H5有一个事件叫 visibilitychange
可以用于监听当前页面是否被挂起。如下:
document.addEventListener("visibilitychange", () => { if(document.hidden) {// 页面被挂起}else {// 页面呼出}
});
但是呢,手Q不会触发这个事件!因为手Q的网页永远都不会被挂起,所以visibilitychange
事件不会被触发。
手Q内的网页永远不会被挂起?
是的。可以在手Q中运行以下代码:
setInterval(() => document.write(new Date().getTime() + "\<br\>"), 1000);
按下HOME键等待十几秒后再呼起手Q,你会发现在页面输出的时间并没有中断,而是很平稳地输出。
好消息是手Q为了解决这个问题向开发者提供了一个叫 qbrowserVisibilityChange
的事件:https://open.mobile.qq.com/api/common/index#api:qbrowserVisibilityChange
能过这个事件可以监听手Q是否被挂起(注意我这里说的是手Q是否被挂,不是说手Q的网页被挂起)。如果按照腾讯提供 API ,那么调用 qbrowserVisibilityChange
需要引用一个 js,如下:
<script type="text/javascript" src="http://pub.idqqimg.com/qqmobi...;></script>;
它的使用方式如下:
mqq.addEventListener("qbrowserVisibilityChange", function(e){if(e.hidden) {// 手Q被挂起}else {// 手Q被呼起}
});
后来我发现,其实手Q把 qbrowserVisibilityChange
直接绑定到 document 对象上了。也就是说在手Q现在不需要引用额外的 js 文件就可以直接调用 qbrowserVisibilityChange
事件,如下:
document.addEventListener("qbrowserVisibilityChange", function(e){if(e.hidden) {// 手Q被挂起}else {// 手Q被呼起}
});
当前(2017-10.26),微信是支持 visibilitychange
事件的,这也就是说微信被挂起时,微信的内嵌页面也会被挂起。
不过,有一个坏消息如果微信的 webview 是 UIWebView 的话,那么不支持 visibilitychange
,也没有一个对应的事件可以监听微信是否被挂起,一句话无解。好消息是 UIWebview 只存在于 2017 年前的版中,即 UIWebview 的情况可以忽略。
可以使用以下方法来监听「微信手Q」的挂起状态:
document.addEventListener("qbrowserVisibilityChange", function(e){var evt = document.createEvent("HTMLEvents"); evt.initEvent("visibilitychange", false, false); evt.hidden = e.hidden; document.dispatchEvent(evt);
}, true);
document.addEventListener("visibilitychange", function(e) {e.hidden = e.hidden === undefined ? document.hidden : e.hidden;
}, true);
在业务代码直接引用下面的代码:
document.addEventListener("visibilitychange", function(e) {text.innerHTML = e.hidden; if(e.hidden) {// 网页被挂起}else {// 网页被呼起}
});
挂起事件有什么用吗?
如果微信手Q的网页有音频播放,那么按下 HOME 键挂起应用后,音频也会继续在播放。这个时候使用 visibilitychange
事件就有用了。如下:
document.addEventListener("visibilitychange", function(e) {if(e.hidden) {// 网页被挂起 ---- 暂停音乐audio.pause(); }else {// 网页被呼起 ---- 播放音乐audio.play(); }
});
监听微信手Q的挂起事件(visibilitychange)相关推荐
- java swing事件监听_Java swing(awt):事件监听机制的实现原理+简单示例
(1)实现原理 事件监听机制的实现: 参考图:事件模型_ActionEvent 为了节省资源,系统无法对某个事件进行实时的监听.故实现的机制是当发生某个事件后,处理代码将被自动运行,类似钩子一般.(回 ...
- 监听Hierachy、Project等视图结构变化的事件
之前上网看了MOMO关于监听Hierachy.Project等视图结构变化的事件,原代码是一个日本人写的,MOMO也没有讲原理.这里我通过自己的理解加了些注释,可能有不正确的地方,希望大神指点. 其中 ...
- angular.js使用路由时,子控制器监听不到父级$boardcast的事件
2019独角兽企业重金招聘Python工程师标准>>> 环境:angular.js+sastruts+apache-tomcat angular.js中当使用路由时,控制器之间通信使 ...
- android 监听电话状态 来电 接听 挂断
如果想要监听手机的来电状态 需要接收手机的电话广播 首先是静态注册 <receiver android:name=".PhoneReceiver"android:expor ...
- Android 监听多个Spinner 的点击事件
同一个界面有多个Spinner 点击事件的时候 只有一个onItemSelected 我们可以使用 给不同的点击事件添加Tag 来区分 具体的做法如下: 下面的代码主要体现在添加spinner.set ...
- java 关闭按钮监听_Java事件处理(1)——实现简单的事件监听功能
假设我们已经建立了一个窗体,并且添加了一个按钮组件. 例:模拟登录界面 1 import javax.swing.*;2 import java.awt.*;3 4 public class Logi ...
- angular指令监听ng-repeat渲染完成后执行自定义事件方法
2019独角兽企业重金招聘Python工程师标准>>> 今天工作中遇到需要用到ng-repeat遍历渲染完后执行某个操作,angular本身并没有提供监听ng-repeat渲染完成的 ...
- java监听机制_详解java的事件监听机制和观察者设计模式
首先说说监听器: 监听器就是一个实现特定接口的普通java程序,这个程序专门用于监听另一个java对象的方法调用或属性改变,当被监听对象发生上述事件后,监听器某个方法将立即被执 行. java的事件监 ...
- java jmenu 监听_Java中用得比较顺手的事件监听
第一次听说监听是三年前,做一个webGIS的项目,当时对Listener的印象就是个"监视器",监视着界面的一举一动,一有动静就触发对应的响应. 一.概述 通过对界面的某一或某些操 ...
最新文章
- 腾讯云服务器部署FTP
- SetWindowLong
- 怎么看cudnn的版本好_祖坟风水怎么看,好祖坟有什么征兆?
- 力扣19,删除链表的倒数第n个节点(JavaScript)
- @Valid注解的使用(转)
- python学习(十八)爬虫中加入cookie
- App 抓包-Fiddler简单使用教程
- 用vuejs如何实现ajax,vuejs使用FormData实现ajax上传图片文件
- win7右键反应特别慢的问题
- python 四象限图_如何快速绘制出四象限图?
- FTP服务器搭建报错Warning: FTP over TLS is not enabled, users cannot securely log in.
- windows下根据端口号查杀进程脚本(BAT脚本)
- java解决撞库的问题_Web安全开发之验证码设计不当引发的撞库问题
- ​什么是gop_cache
- php邮箱必填,ZBlogPHP-1.5 以上版本修改实现用户评论时必填邮箱的功能
- 朴素贝叶斯--过滤垃圾邮件实例
- WinCE系统编译过程
- 梳理谷歌45篇入选CVPR论文,后附GAN主题演讲PPT下载!
- python百度推广api,查询实时账户情况,展现量、点击量、消费、点击率、点击均价
- 小学课程表怎么排?如何快速高效地解决排课问题?