在phonegap应用程序的退出(硬件按钮)上显示确认框

时间:2016-12-10 08:40:56

标签: javascript android cordova phonegap-plugins phonegap-build

我正在使用phonegap上的iframe安卓应用。我使用phonegap build来在线编译我的代码。有一天,我正在搜索一个代码,弹出确认框,显示"你要退出吗?"是的|没有?我拿出这些代码。但它没有用。你可以帮忙吗?我们必须在config.xml中添加任何插件吗?

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Test Layout</title>
        <script type="text/javascript" charset="utf-8">

            document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
    document.addEventListener("backbutton", onBackKeyDown, false); //Listen to the User clicking on the back button
}
function onBackKeyDown(e) {
    e.preventDefault();
    navigator.notification.confirm("Are you sure you want to exit ?", onConfirm, "Confirmation", "Yes,No"); 
    // Prompt the user with the choice
}
function onConfirm(button) {
    if(button==2){//If User selected No, then we just do nothing
        return;
    }else{
        navigator.app.exitApp();// Otherwise we quit the app.
    }
}
        </script>
        <style type="text/css">
            body, html
            {
                margin: 0; padding: 0; height: 100%; overflow: hidden;
            }
            #content
            {
                position:absolute; left: 0; right: 0; bottom: 0; top: 0px; 
            }
        </style>

    </head>
    <body>
        <div id="content">
            <iframe width="100%" height="100%" frameborder="0" src="#" />
        </div>
    </body>
</html>

3 个答案:

答案 0 :(得分:0)

对于Apache Cordova / Phonegap,您不需要任何插件来处理本机事件(例如devicereadybackbutton),但您需要cordova-plugin-dialogs plug-in来显示本机警报。

所以,我猜你的问题不是要抓住事件,而是要显示警报。

请尝试只打印一个经典的window.alert(),以验证事件是否被捕获,然后您可以尝试使用对话框插件。

答案 1 :(得分:0)

我认为您的代码中有两处更改

首先,如果您还没有添加cordova.js,请将其添加到文件的标题部分

第二,在调用backbutton事件之前,你需要花一些时间来完成页面的加载,否则它将无法理解后退按钮点击事件

所以在这里我只是为你的功能添加了超时

function onDeviceReady() {
    setTimeout(function(){
        document.addEventListener("backbutton", onBackKeyDown, false); //Listen to the User clicking on the back button
    },500);
}

这也是我的工作代码。

$(document).ready(function(){
    setTimeout(function(){
        document.addEventListener('backbutton', function(e){    
            if (confirm("Are you sure you want to exit app?"))
            {
                navigator.app.exitApp();
            }   
        }, false);
    }, 500);
}

答案 2 :(得分:0)

这是我按下后退键的工作代码,它会要求退出

document.addEventListener("backbutton", function (e) {
    e.preventDefault();
    navigator.notification.confirm("Are you sure want to exit from App?", onConfirmExit, "Confirmation", "Yes,No");
}, false);


function onConfirmExit(button) {
    if (button == 2) { //If User select a No, then return back;
        return;
    } else {
        navigator.app.exitApp(); // If user select a Yes, quit from the app.
    }
}