如何在phonegap / cordova中检测Android后退按钮

Question

I'm currently using cordova 3.7.1. 我目前正在使用cordova 3.7.1。 In my app I'm not able to detect the hardware back button in my jquery script. 在我的应用程序中，我无法在jquery脚本中检测到硬件后退按钮。 I trying out like this: $(document).ready(function() { //registering the back button document.addEventListener("backbutton", onBackKeyDown, false); }); 我尝试这样： $(document).ready(function() { //registering the back button document.addEventListener("backbutton", onBackKeyDown, false); });

function onBackKeyDown(e) { alert("back button pressed");//alert if the android back button is pressed }

But this does not work. 但这不起作用。 I have tried all possibility 我已经尝试了所有可能性

I have also tried to get the current URL in the MainActivity.java using 我还尝试使用MainActivity.java中的当前URL

appView.getUrl();

But this does not return the url of the div If I have a div as #page2 it is not returning the url. 但这不会返回div的url如果我有一个div作为＃page2它没有返回url。

It only returns http://sas.cer.org/index.html . 它只返回http://sas.cer.org/index.html 。 Its is not returning http://sas.cer.org/index.html#page2 它没有返回http://sas.cer.org/index.html#page2

I'm also using jquery mobile. 我也在使用jquery mobile。

Are there any alternatives for handling the android/hardware back button on the Native or on the Jquery side?? 是否有任何替代方法来处理Native或Jquery端的android / hardware后退按钮？

Answer 1

There are two solutions : 有两种解决方案：

1) You need to include cordova.js in script tag in head section in your index html file to make the events and plugins work. 1）您需要在索引html文件的head部分的script标签中包含cordova.js，以使事件和插件工作。

<script type="text/javascript" charset="utf-8" src="cordova.js"></script>

You might not be able to see this file in your folder, but the phonegap | 您可能无法在文件夹中看到此文件，但看到了phonegap | cordova command builds it when running on mobile. cordova命令在移动设备上运行时构建它。

2) Modify your code as given here. 2）修改您在此处给出的代码。 Use mobile-specific events for proper functioning of your app. 使用特定于移动设备的活动来确保您的应用正常运行。

Answer 2

The following is employed and working great in an app we deploy to cordova and web. 以下内容适用于我们部署到cordova和web的应用程序。

Requires window._cordovaNative = true if in cordova. 如果在cordova中，则需要window._cordovaNative = true 。

I left my button handling code in there as example (see " // close menu if open " and other comments), which you need to replace with your code. 我在那里留下了我的按钮处理代码（参见“ // close menu if open ”和其他注释），您需要用代码替换它们。

Put this somewhere: 把它放在某个地方：

let bNH, bakNavHandler = bNH = {
    warningOpen: false,
    init: function(){
        if (window._cordovaNative)
            document.addEventListener('backbutton', this.onback, false);
        else {
            if (!window.performance || performance.navigation.type != 1)
                this.preventDefault();
            window.onpopstate =  this.onback;
        }
    },
    preventDefault: function(e){
        window._cordovaNative ? 
            e.preventDefault() : 
            window.history.pushState(null, '', window.location.href);
    },
    onback: function(e){
        // close menu if open
        if ($('#ekapp_menu_div').css('margin-right') == '-2px'){
            bNH.preventDefault(e)
            _that.hideMenuDiv();
        }
        // close modal if open
        else if (!bNH.warningOpen && $('#ekapp_modal:visible')[0]){
            bNH.preventDefault(e)
            _that.closeModal();
        }
        // prev screen if history
        else if (_that.history.length > 1) {
            bNH.preventDefault(e)
            _that.previousScreen();
        }
        // show close app warning
        else if (!bNH.warningOpen) {
            if (window._cordovaNative)
                bNH.preventDefault(e);
            _that.openModal('Tap back button again to exit app!');
            bNH.warningOpen = true;
            $('#ekapp_modal_buttons .ekapp_cancel_btn').one('click', function(){
                bNH.warningOpen = false;
                if (!window._cordovaNative)
                    bNH.preventDefault();
            });
        }
    }
};

Then in your deviceready (cordova) or doc ready (web) init function do: 然后在你的deviceready（cordova）或doc ready（web）init函数中执行：

bakNavHandler.init();

Answer 3

Read the doc, you have a full example there 阅读文档，你有一个完整的例子

You have to listen for the deviceready event, not for document ready 您必须侦听deviceready事件，而不是文档就绪

<!DOCTYPE html>
<html>
  <head>
    <title>Back Button Example</title>

    <script type="text/javascript" charset="utf-8" src="cordova.js"></script>
    <script type="text/javascript" charset="utf-8">

    // Wait for device API libraries to load
    //
    function onLoad() {
        document.addEventListener("deviceready", onDeviceReady, false);
    }

    // device APIs are available
    //
    function onDeviceReady() {
        // Register the event listener
        document.addEventListener("backbutton", onBackKeyDown, false);
    }

    // Handle the back button
    //
    function onBackKeyDown() {
    }

    </script>
  </head>
  <body onload="onLoad()">
  </body>
</html>

如何在phonegap / cordova中检测Android后退按钮

问题描述

3 个解决方案

解决方案1
3 2015-04-16 15:19:37

解决方案2
1 2018-10-06 20:52:46

解决方案3
0 2015-04-20 11:02:13

如何在phonegap / cordova中检测Android后退按钮

问题描述

3 个解决方案

解决方案1 3 2015-04-16 15:19:37

解决方案2 1 2018-10-06 20:52:46

解决方案3 0 2015-04-20 11:02:13

解决方案1
3 2015-04-16 15:19:37

解决方案2
1 2018-10-06 20:52:46

解决方案3
0 2015-04-20 11:02:13