从网页监听Android设备的返回键
最近搞Android项目的时候,遇到一个比较蛋疼的需求,需要从Client App调用系统浏览器打开一个页面,进行杂七杂八的一些交互之后,返回到App。如何打开浏览器和如何返回App这里就不说了,有兴趣的童鞋可私下交流。
之所以说这个需求蛋疼,是因为Android有个物理返回键啊……返回键啊……键啊……啊……
用户按下返回键后,预期应该跟点击页面上的返回键一样——返回App。然而这个返回键的被按下的时候网页完全不知道啊(onbeforeunload不算),找不到直接的办法去监听,愁死我们这全苦逼程序员鸟~
虽然啊不能直接监听,曲线救国的办法,还是有滴。
经过艰苦卓绝的寻找,发现使用HTML5的History可以稍微模拟到返回键的按下事件。原理如下:
- 页面加载完成时,调用history.pushState写入一个指定状态STATE,并监听window.onpopstate;
- 当onpopstate被触发时,检查event.state是否等于STATE,如果相等,表示页面发生了后退(按下返回键或者浏览器的后退按钮),则把这次行为当作是返回键被按下了(把点击浏览器的后退按钮也误算进来了,不过没啥好法子了呀)。
嗯,为了方便调用,把这个逻辑稍微封装了下,代码见这里(https://github.com/iazrael/xback),使用方法如下:
XBack.listen(function(){
alert('oh! you press the back button');
});
XBack.listen(function(){
alert('ah, press press press');
});
不过这个方法有些缺陷:
- 如果项目本身使用了pushState,则历史记录会有瑕疵(多了一个历史);
- 浏览器的后退按钮点击以及调用history.back()也会被当成按下了返回键。
But anyway,对于结构和逻辑比较简单的跳转页来说(就是为了返回App用的),这个方法还是蛮实用的,对不对?嘻嘻~
从网页监听Android设备的返回键的更多相关文章
- vue监听移动设备的返回事件
在公共方法文件common.js中实现一个存储当前历史记录的方法 common.js // 存储当前历史记录点,实现控制手机物理返回键的按钮事件 var pushHistory = function ...
- 在 React 组件中监听 android 手机物理返回/回退/back键事件
当前端页面嵌入到 webview 中运行时,有时会需要监听手机的物理返回按键事件来做一些自定义的操作. 比如我最近遇到的,在一个页面里面有批量选择的功能,当点击手机的返回键时,清除页面上的选中状态.我 ...
- HTML5 监听移动端浏览器返回键兼容版本
// 往windosw对象中的历史记录注入URL的方法 function addUrl() { var state = { title: "title", url: "# ...
- vue里监听安卓的物理返回键
Hybrid App中,原生内嵌H5单页,由于安卓是有物理返回键的,按安卓物理返回键的时候会返回到上一个路由. 实际中需求是:当有弹层的时候,按物理返回键是关闭弹层,是页面的时候才执行返回上一个路由, ...
- Cocos Creator 监听安卓屏幕下方返回键
addEscEvent = function(node){ cc.eventManager.addListener({ event: cc.EventListener.KEYBOARD, onKeyP ...
- vue 定义全局函数,监听android返回键事件
vue 定义全局函数,监听android返回键事件 方法一:main.js 注入(1)在main.js中写入函数Vue.prototype.changeData = function (){ aler ...
- 监听Android CTS测试项解决方案(二)
二,监听当前测试项是否是Accelerometer Measurement Test测试项 通过第一种方式介绍的,我们可以得到当前处于活动状态的Activity类似监听CTS测试当前的测试项.但是由于 ...
- 监听Android CTS测试项解决方案(一)
前言: 首先这里需要详细叙述一下标题中"监听Android CTS测试项解决方案"的需求.这里的需求是指我们需要精确的监听到当前CTS测试正在测试的测试项. 因为我们知道CTS认证 ...
- c# 获取移动硬盘信息、监听移动设备的弹出与插入事件
原文 http://www.cnblogs.com/coolkiss/p/3328825.html 备忘一下改功能,主要通过WMI来实现,对于监听外接设备的弹出和插入事件一开始使用IntPtr Wnd ...
随机推荐
- android 解析XML方式(三)
上一节中,我们使用SAX方式解析xml文档, SAX方式是基于事件驱动的.当然android的事件机制是基于回调函数的.在这一节中,我们用另外一种方式解析xml文档,这种方式也是基于事件驱动的,与SA ...
- php浮点数精确运算
php浮点数精确运算 Php: BCMath bc是Binary Calculator的缩写.bc*函数的参数都是操作数加上一个可选的 [int scale],比如string bcadd(strin ...
- rabbitMQ安装及部署
1.安装 rpm -ivh erlang-18.3-1.el6.x86_64.rpm, 下载地址:http://www.rabbitmq.com/releases/erlang/ rpm --impo ...
- POJ 3286 How many 0's?
题目链接 题意 :写下m到n之间所有的数,会写多少个0. 思路 :先算0到m的,再算0到n的,最后相减. 网上有位大神是这么推的,看下面.... 首先转化成求 [0, x] 中所有数中,含有的 0 的 ...
- POJ2586Y2K Accounting Bug
http://poj.org/problem?id=2586 Description Accounting for Computer Machinists (ACM) has sufferred fr ...
- 快速学习bootstrap前台框架
W3c里的解释 使用bootstrap需要注意事项 1. 在html文件第一行要加上<!doctype html>[s1] 2. 导入bootstrap.min.css文件 3. 导 ...
- ScannerTest-------double string
import java.util.*; public class ScannerTest { public static void main(String[] args){ Scanner scann ...
- Eclipse项目和MyEclipse项目
因为Eclipse的项目结构和MyEclipse项目的结构不同,所以两者的项目之间不能直接运行的. 我们在创建Eclipse项目的时候可以进行一些设置,这样在Eclipse中创建的项目可以直接在MyE ...
- Spring使用外部的配置文件
在使用Spring做web项目的时候,通常会使用到数据库的连接信息 jdbcUrl driverClass username password 那么应该如何使用这些属性呢? 如在Spring中使用数据 ...
- Spring与Hibernate整合
Spring与Struts2整合的目的: 让Spring管理Action Spring整合Hinernate的目的: --管理SessionFactory(单例的),数据源 --声明式事务管理 1.首 ...