Question

我正在使用Cordova / PhoneGap开发我的第一款适用于Android的AngularJS移动应用程序。我在我的脚本文件中添加了以下代码，但我无法捕获后退按钮事件。这是我在scripts.js中的内容：

  var app = angular.module('QFA', []);

  app.controller('QFAinit', function( $scope, $window ) {

          document.addEventListener("deviceready", onDeviceReady(), false);

          function onDeviceReady() {

            $window.alert("Device Ready-1");
            document.addEventListener("backbutton", onBackKeyDown, false);
            $window.alert("Device Ready-2");

            function onBackKeyDown() {
              $window.alert("Inside onBackKeyDown1");
            }
         }
  });

我称之为：

  <body ng-controller="QFAinit">

当我运行App时，我会得到＆＃34; Device Ready-1＆＃34;和＆＃34;设备就绪-2＆＃34;警报。这意味着deviceready事件正在被正确触发，并且还尝试了后退按钮。但是，当我按下后退按钮时，没有任何按预期发生，而是执行默认行为，即应用程序退出。

另一方面，如果我在eventlistener命令上用onBackKeyDown（）替换onBackKeyDown，那么我得到＆＃34; Inside onBackKeyDown1＆＃34;在上面提到的两个警报之后立即加载应用程序时发出警报。但是一旦加载了应用程序，就不存在后退功能。

我该如何做到这一点？

更新

我已经意识到我需要包含cordova.js以捕获后退按钮。一旦我添加，后退按钮确实被困。但是，由于这一点，我得到了一个破坏的应用程序，如下所示：

enter image description here

我也尝试将jQuery的版本从2.1更改为1.11,1.10和1.4.5，但这并没有任何影响。事实上，即使我删除了jQuery，我仍然会破坏界面。

Answer 1

如果我正确提醒，移动设备上的警报框是否异步。应用程序可能没有时间显示警告框，因为它已经关闭。如果您执行console.log，您可以在Eclipse logcat中阅读它吗？或者如果你做了一个防止默认，它应该阻止关闭应用程序：

 function onBackKeyDown(event) {
     event.preventDefault();
     $window.alert("Inside onBackKeyDown1");
 }

Answer 2

以下是最终为我工作的内容，将所有内容放入部分。虽然它也适用于Body。不再是控制器了。

  <link rel="stylesheet" href="js/bootstrap.min.css">
  <link rel="stylesheet" href="js/bootstrap-theme.min.css">

  <script src="js/jquery-1.11.2.min.js"></script>
  <script src="cordova.js"></script>        

  <script>
     document.addEventListener("deviceready", onDeviceReady(), false);

     function onDeviceReady() {

       document.addEventListener("backbutton", onBackKeyDown, true);

     }

     function onBackKeyDown() {
        alert('Back Button Pressed');
        resp = confirm("If you use Home key to exit, the App will remain active. Still want to Quit?");
        if (resp === true) {
          navigator.app.exitApp();
        }
     }
   </script>

  <script src="js/angular.min.js"></script>
  <script src="js/angular-resource.min.js"></script>
  <script src="js/bootstrap.min.js"></script>
  <script type="text/javascript" src="app.js"></script>

AngularJS中的移动后退按钮，Cordova / PhoneGap无法正常工作

更新

2 个答案: