在 phonegap 应用程序的退出(硬件按钮)上显示确认框
Posted
技术标签:
【中文标题】在 phonegap 应用程序的退出(硬件按钮)上显示确认框【英文标题】:Show confirmation box on exit(hardware button) in phonegap app 【发布时间】:2017-04-25 17:11:13 【问题描述】:我正在 phonegap 上开发 iframe android 应用程序。我使用 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 frameborder="0" src="#" />
</div>
</body>
</html>
【问题讨论】:
【参考方案1】:对于 Apache Cordova / Phonegap,您不需要任何用于本地事件的插件(例如 deviceready
或backbutton
),但您需要 cordova-plugin-dialogs
plug-in 来显示本地警报。
所以,我猜你的问题不是捕捉事件,而是显示警报。
请尝试打印一个经典的window.alert()
,以验证事件是否被捕获,之后您可以尝试使用对话框插件。
【讨论】:
【参考方案2】:我认为您的代码中有两个变化
首先,如果您还没有添加cordova.js
,请将其添加到文件的标题部分
其次,在调用后退按钮事件之前你需要给一些时间来完成页面的加载,否则它不会理解后退按钮点击事件
所以在这里我只是为你的函数添加了超时
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);
【讨论】:
【参考方案3】:这是我按下后退按钮的工作代码,它会要求退出
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.
【讨论】:
以上是关于在 phonegap 应用程序的退出(硬件按钮)上显示确认框的主要内容,如果未能解决你的问题,请参考以下文章
如何处理phonegap应用程序中iphone上丢失的硬件后退按钮?
在Phonegap / iOS中按下主页按钮时访问localStorage