41

我正在尝试使用 jquery mobile 和 cordova 对 RSS 阅读器进行编程。我的 RSS 阅读器由 3 页组成（在同一个 HTML 文档中：page1、page2、page3）。我正在尝试覆盖（硬件）后退按钮行为，以便退出程序。为了检查我在项目设置中没有犯任何错误，我使用了 PhoneGap 示例项目并将其加载到 Eclipse 中。每个示例函数都有效，因此我将 index.html 和 res 文件夹移至 phonegap 示例。在我的 index.html 中，我导入了以下脚本：

<script src="res/jquery-1.7.1.min.js"></script>
<script src="res/jquery.mobile-1.1.1.min.js"></script>
<script type="text/javascript" charset="utf-8" src="cordova-2.0.0.js"></script>
<script type="text/javascript" charset="utf-8" src="main.js"></script>

我的 main.js 文件如下所示：

document.addEventListener("backbutton", function(e){
if($.mobile.activePage.is('#homepage')){
    e.preventDefault();
    navigator.app.exitApp();
}
else {
    navigator.app.backHistory()
}
}, false);

您可以在第一个代码示例中检查我的脚本版本。关于如何让代码工作的任何想法，以便在我按下 Xperia Arc 上的后退按钮时它会简单地退出应用程序？如果需要，我可以上传我的完整代码。

编辑：我已经在我的 android 手机上测试了 phonegap(cordova) beep 功能，它可以工作，所以这没有任何脚本实现错误。它必须在 main.js 文件中。可能与 jquerymobile 后退按钮功能和 phonegap 后退按钮功能存在一些兼容性问题。

4

5 回答 5

87

您需要等待设备准备好添加事件侦听器：

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

function onDeviceReady(){
    document.addEventListener("backbutton", function(e){
       if($.mobile.activePage.is('#homepage')){
           e.preventDefault();
           navigator.app.exitApp();
       }
       else {
           navigator.app.backHistory();
       }
    }, false);
}
于 2012-09-11T15:04:18.177 回答
12

如果您不想使用任何库，可以使用 window.location.hash 来获取您的应用所在的“面板”。例子 ：

function onDeviceReady(){
    document.addEventListener("backbutton", function(e){
        if(window.location.hash=='#home'){
            e.preventDefault();
            navigator.app.exitApp();
        } else {
            navigator.app.backHistory()
        }
    }, false);
}
document.addEventListener("deviceready", onDeviceReady, false);
于 2014-06-02T18:56:23.720 回答
8

如果您不想使用 Jquery Mobile，请将 @mornaner 答案上的 $.mobile.activePage.is('#homepage') 更改为 document.getElementById('#homepage') ，如下面的代码所示：

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

function onDeviceReady(){
    document.addEventListener("backbutton", function(e){
       if(document.getElementById('#homepage')){
           e.preventDefault();
           navigator.app.exitApp();
       }
       else {
           navigator.app.backHistory()
       }
    }, false);
}

通过这种方式，不需要只为此目的下载Jquery Mobile 乱码。此外，activePage 自 JQuery mobile 1.4.0 起已弃用，将从 1.5.0 中删除。（改用 pagecontainer 小部件中的 getActivePage() 方法）

于 2014-05-29T22:15:08.520 回答
1

要在 android 设备上禁用后退按钮的默认行为，只需为后退按钮注册一个事件处理程序。这将防止后退按钮关闭应用程序。

下面显示的代码专门用于 Framework7

$(document).on('page:beforeinit', function (e) {
if( $.fn.hyellaIMenu.mainView.history && $.fn.hyellaIMenu.mainView.history.length > 1 ){
    document.addEventListener( "backbutton", disableBackButton, false );
}
});

function disableBackButton( e ){
    if( $.fn.hyellaIMenu.mainView.history && $.fn.hyellaIMenu.mainView.history.length < 3 ){
        document.removeEventListener("backbutton", disableBackButton );
    }

if( $.fn.hyellaIMenu.mainView.history && $.fn.hyellaIMenu.mainView.history.length > 1 ){
    $.fn.hyellaIMenu.mainView.router.back();
}
};

要覆盖默认的后退按钮行为，请为后退按钮事件注册一个事件侦听器。

注意：不再需要调用任何其他方法来覆盖后退按钮行为。

https://cordova.apache.org/docs/en/latest/cordova/events/events.html#backbutton

于 2017-12-24T21:31:10.493 回答
0 
function onLoad() {
        document.addEventListener("deviceready", onDeviceReady, false);
    }

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

    // Handle the back button
    //
    function onBackKeyDown() {
    }
于 2016-12-21T06:51:17.807 回答