zoukankan      html  css  js  c++  java
  • 从网页监听Android设备的返回键

    最近搞Android项目的时候,遇到一个比较蛋疼的需求,需要从Client App调用系统浏览器打开一个页面,进行杂七杂八的一些交互之后,返回到App。如何打开浏览器和如何返回App这里就不说了,有兴趣的童鞋可私下交流。

    之所以说这个需求蛋疼,是因为Android有个物理返回键啊……返回键啊……键啊……啊……

    用户按下返回键后,预期应该跟点击页面上的返回键一样——返回App。然而这个返回键的被按下的时候网页完全不知道啊(onbeforeunload不算),找不到直接的办法去监听,愁死我们这全苦逼程序员鸟~

    虽然啊不能直接监听,曲线救国的办法,还是有滴。

    经过艰苦卓绝的寻找,发现使用HTML5的History可以稍微模拟到返回键的按下事件。原理如下:

    1. 页面加载完成时,调用history.pushState写入一个指定状态STATE,并监听window.onpopstate;
    2. 当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');
    });

    不过这个方法有些缺陷:

    1. 如果项目本身使用了pushState,则历史记录会有瑕疵(多了一个历史);
    2. 浏览器的后退按钮点击以及调用history.back()也会被当成按下了返回键。

    But anyway,对于结构和逻辑比较简单的跳转页来说(就是为了返回App用的),这个方法还是蛮实用的,对不对?嘻嘻~

  • 相关阅读:
    React生命周期, 兄弟组件之间通信
    React组件式编程Demo-用户的增删改查
    React之this.refs, 实现数据双向绑定
    CCF CSP 201812-4 数据中心
    CCF CSP 201812-4 数据中心
    PAT 顶级 1020 Delete At Most Two Characters (35 分)
    PAT 顶级 1020 Delete At Most Two Characters (35 分)
    Codeforces 1245C Constanze's Machine
    Codeforces 1245C Constanze's Machine
    CCF CSP 201712-4 行车路线
  • 原文地址:https://www.cnblogs.com/daqianduan/p/4625394.html
Copyright © 2011-2022 走看看