在phonegap应用程序中退出时显示确认框（硬件按钮）
[英]Show confirmation box on exit(hardware button) in phonegap app
问题描述
I am working on a iframe android app on phonegap. 
我正在在phonegap上使用iframe android应用程序。 I use phonegap build to compile my code online. 我使用phonegap构建来在线编译代码。 For a day,I am searching for a code that pop out confirmation box that shows "do you want to exit?" 一天，我正在寻找一个代码，该代码弹出确认框，显示“您要退出吗？” yes|no ?? 是|否？ I comeout with these code.But it is not working.Can you help out? 我给出了这些代码，但是它不起作用，你能帮忙吗？ do we have to add any plugin in config.xml? 我们必须在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 个解决方案
解决方案1
0 2016-12-10 15:17:08
For Apache Cordova / Phonegap you don't need any plug-in for the native events (like deviceready or backbutton ) but you need the cordova-plugin-dialogs plug-in to show the native alerts. 对于Apache科尔多瓦/ PhoneGap的，你不需要为本地事件（如任何插件deviceready或backbutton ），但你需要的cordova-plugin-dialogs 插件 ，显示本地警报。
So, I'm guessing that your problem is not to catch the event, but to show the alert. 因此，我猜测您的问题不是捕获事件，而是显示警报。
Please, try just ti print a classic window.alert() , to verify if the event is catch, after that you can try with the dialog plug-in. 请尝试仅打印经典的window.alert() ，以验证事件是否被捕获，然后您可以尝试使用对话框插件。
解决方案2
0 2016-12-12 07:00:38
I think two changes are there in your code 我认为您的代码有两个更改
first, if you haven't added cordova.js then please add it to your header section of file 首先，如果您尚未添加cordova.js则请将其添加到文件的标题部分
second, before calling backbutton event you need to give some time to complete loading of the page otherwise it will not understand the back button click event 其次，在调用backbutton事件之前，您需要花一些时间来完成页面的加载，否则它将无法理解backbutton click事件
So here I just added timeout to your function 所以在这里我只是将超时添加到您的函数中
function onDeviceReady() {
setTimeout(function(){
document.addEventListener("backbutton", onBackKeyDown, false); //Listen to the User clicking on the back button
},500);
}
Here is my working code too. 这也是我的工作代码。
$(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);
}
解决方案3
0 2016-12-12 10:33:38
here is my working code on pressing backbutton it will ask for exit 这是我按下后退按钮时的工作代码，它将要求退出
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.
}
}
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.