var hiddenProperty ='hidden' in document ? 'hidden' :'webkitHidden' in document ? 'webkitHidden' : 'mozHidden' in document ? 'mozHidden' : null;
var visibilityChangeEvent = hiddenProperty.replace(/hidden/i,'visibilitychange');
var onVisibilityChange = function () {
if (document[hiddenProperty]) {
console.log('页面非激活');
} else {
console.log('页面激活' )
}
}
document.addEventListener(visibilityChangeEvent, onVisibilityChange);

这段代码的原理我个人理解就是通过判断用户浏览的是否为当前页,从而进行相关操作。

H5新特性监听手机的返回键的更多相关文章

  1. JavaScript监听手机物理返回键的两种解决方法

    JavaScript没有监听物理返回键的API,所以只能使用 popstate 事件监听. 有两个解决办法: 1.返回到指定的页面 pushHistory(); window.addEventList ...

  2. VueApp监听手机物理返回键的事件

    代码 第一步创建js文件夹子 在main里面引用   JS文本内容如下 //监听手机物理返回键的事件 document.addEventListener('plusready', function() ...

  3. mui 监听 手机 物理返回键

    mui.back = function(){ return  //禁用物理返回键  也可以写其他逻辑 }

  4. 页面返回刷新或H5监听(手机的)返回键

    1. pushHistory(); window.addEventListener("popstate", function(e) { alert("我监听到了浏览器的返 ...

  5. JS监听手机物理返回键,返回到指定页面

    pushHistory(); window.addEventListener("popstate", function(e) { window.location = data.in ...

  6. Html5 监听拦截Android返回键方法详解

    浏览器窗口有一个history对象,用来保存浏览历史. 如果当前窗口先后访问了三个网址,那么history对象就包括三项,history.length属性等于3. history对象提供了一系列方法, ...

  7. 知识点---js监听手机返回键,回到指定界面

    方法一. $(function(){ pushHistory(); window.addEventListener(“popstate”, function(e) { window.location ...

  8. js history对象 手机物理返回键

    有兴趣的可以了解下history对象,不感兴趣也可以直接跳到手机物理返回键监听部分 使用场景: 场景1:项目中一个表单页面,需得填写验证码,填写验证码后提交,由于使用的form直接提交,没有使用AJA ...

  9. js监听手机端点击物理返回键或js监听pc端点击浏览器返回键

    之前在项目中遇到一个问题,就是在微信网页上面本来是有返回按钮的,但是大多数人都为了方便,会使用安卓手机自带的物理返回键,这个返回键按下后,就会按照你浏览器的栈存储的路径来一层一层返回,就不执行你页面上 ...

随机推荐

  1. sharepoint_study_3

    SharePoint网页无法打开 描述:安装部署好SharePoint开发环境后,再修改计算机的机器名,重启计算机后,发现SharePoint网站不能打开. 解决:1.将机器名改回去,重启计算机,问题 ...

  2. ZOJ - 3632 DP 单调优化

    题意:买瓜,每天的瓜有不同的价格和xu命时间,要求能苟到第n天的最小代价 定义DP方程\(dp[i]\),指苟到第\(i\)天的最小代价,所求即为\(dp[n]\) 那么怎么转移就是问题,这里的状态表 ...

  3. js请求数据的例子

    //es6实现方式 const getData = async ()=> { //同步请求数据 const res1=await this.$http.get("https://www ...

  4. D. Diverse Garland-----CF字符串

    D. Diverse Garland time limit per test 1 second memory limit per test 256 megabytes input standard i ...

  5. 【CTF】某xss练手小游戏

    http://test.xss.tv 1.http://47.94.13.75/test/level1.php?name=test 直接插入即可,如: http://47.94.13.75/test/ ...

  6. C++ GUI Qt4编程(12)-6.1FindFileDialog

    1. 主要介绍了QGridLayout, QHBoxLayout, QVBoxLayout3种布局管理器的使用方法. 2. 在linux中,继承自QDialog的对话框,没有最大化.最小化.关闭按钮, ...

  7. Spark (Python版) 零基础学习笔记(一)—— 快速入门

    由于Scala才刚刚开始学习,还是对python更为熟悉,因此在这记录一下自己的学习过程,主要内容来自于spark的官方帮助文档,这一节的地址为: http://spark.apache.org/do ...

  8. Js与标签属性

    关于在JS中设置标签属性 2017-10-09 23:04 by 清风221, 12790 阅读, 0 评论, 收藏, 编辑 Attribute 该属性主要是用来在标签行内样式,添加.删除.获取属性. ...

  9. 基于WebImage的图片上传工具类

    支持缩略图和水印. using System; using System.IO; using System.Linq; using System.Web; using System.Web.Helpe ...

  10. maven入门与常用插件使用

    maven不仅仅是一款管理jar包的工具,还可以