H5监听Android物理返回键

问题:H5页面的返回键可以回退到指定页面,但是Android手机的物理返回键会回到上一页。

解决办法:以下代码可以实现,Android返回键时调用H5的方法(下面代码中用的是H5的GoBackUrl方法),实现跳转到指定页面。

        //拦截安卓回退按钮,调用H5的返回方法
        history.pushState(null, null, location.href);
        window.addEventListener(‘popstate‘, function (event) {
            history.pushState(null, null, location.href);
            GoBackUrl();//H5自己定义的返回方法
        });

参考文档:

https://www.cnblogs.com/hellxz/p/7764932.html

原文地址:https://www.cnblogs.com/panxiaoming/p/9343462.html

时间: 2024-10-14 05:50:08

H5监听Android物理返回键的相关文章

监听微信物理返回键,并返回指定页面

我们要了解浏览器的history.大家知道在页面中我们可以使用JavaScript window history,后退到前面页面,但是由于安全原因javascript不允许修改 history里已有的url链接,但可以使用pushState方法往history里增加url链接,并且提供popstate事件监测从history栈里弹出url.既然有提供popstate事件 监测,那么我们就可以进行监听. 返回.后退.上一页按钮点击监听实现代码: window.addEventListener("p

react native 之 Android物理返回键

基本用法 根据文档,安卓back键的处理主要就是一个事件监听: 1 BackAndroid.addEventListener('hardwareBackPress', this.onBackPressed); 2 BackAndroid.removeEventListener('hardwareBackPress', this.onBackPressed); 在starter-kit里,我们在App这一级别,实现了按back键回退导航栈的功能: 1 class App extends React

监听Android的Home键碰到的问题

Android的TV监听Home键切换信源碰到的问题 实现的功能是按下Home键,焦点放到TV小窗口上,再次按下Home键,切换信源,进入另一个信源.在另一个信源的显示下,按下Home键,原信源视图缩小并显示当前信源. 这个需求的解决代码比较容易的.实现一个BroadCastReceiver,监听Home键.但是依照HOME键的实现的时候,系统会切换到当前Launcher,因此,在当前信源的情况下点击HOME键,走的流程是: onPause->onStop->onRestart->onS

js history对象 手机物理返回键

有兴趣的可以了解下history对象,不感兴趣也可以直接跳到手机物理返回键监听部分 ******************[history对象]有length属性,go()/back()/forward()跳转方法**************************** 我们要了解浏览器的history对象, history对象保存着用户上网的历史记录,从窗口被打开的那一刻算起:history.length属性保存着历史记录的URL数量.初始时,该值为1.如果当前窗口先后访问了三个网址,histo

从网页监听Android设备的返回键

最近搞Android项目的时候,遇到一个比较蛋疼的需求,需要从Client App调用系统浏览器打开一个页面,进行杂七杂八的一些交互之后,返回到App.如何打开浏览器和如何返回App这里就不说了,有兴趣的童鞋可私下交流. 之所以说这个需求蛋疼,是因为Android有个物理返回键啊……返回键啊……键啊……啊…… 用户按下返回键后,预期应该跟点击页面上的返回键一样——返回App.然而这个返回键的被按下的时候网页完全不知道啊(onbeforeunload不算),找不到直接的办法去监听,愁死我们这全苦逼

Vue-app:物理返回键设置(单击跳转/双击退出)

1.概述 实现手机物理返回键的跳转逻辑:除特殊页面(例如首页.我的等一级页面),单击跳转到前一页:一级页面(除首页)单击跳转到首页:首页单击提示“在单击一次,退出app”,单击两次退出app. 2.代码步骤 1.在main.js中 import Mui from 'vue-awesome-mui';        Vue.use(Mui); 2.在index.html中   <script>        mui.init({            keyEventBind: {      

js修改物理返回键功能

preventBack: function(theurl){ var pushState = window.history.pushState; //点击物理返回键时,退出到跳转定义首页 if(pushState){ window.history.pushState({a: Math.random()},'', location.href); window.addEventListener('popstate', function(){ var type = typeof(theurl); ty

Android 监听 Android中监听系统网络连接打开或者关闭的实现代码

本篇文章对Android中监听系统网络连接打开或者关闭的实现用实例进行了介绍.需要的朋友参考下 很简单,所以直接看代码 复制代码 代码如下: package xxx; import android.content.BroadcastReceiver;  import android.content.Context;  import android.content.Intent;  import android.net.ConnectivityManager;  import android.ne

React Native组件之BackAndroid !安卓手机的物理返回键的使用

ok!在安卓手机上,当我们用物理返回键的时候,会以一次性的将程序退出来,这样是很不好的体验,所以就需要使用RN的物理返回键组件:BackAndroid,其原理也就是 分析路由,然后pop()这样! ok!先来说下路由栈吧!,有一点计算机技术基础的同学都应该学过堆栈,其中的栈就是后入先出,也就是RN里面的push(入栈),pop(出栈)! 好的!如图所示! 1:两个路由之间的backandroid else return 直接退出应用 2:在注册组件设置backAndroid(这里注意了,在注册组