jQuery Mobile的和Android设备与后退按钮build.phonegap.com [英] jQuery Mobile and Android device back button with build.phonegap.com
本文介绍了jQuery Mobile的和Android设备与后退按钮build.phonegap.com的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在开发使用jQuery Mobile和PhoneGap的Android移动应用程序。我是新来的开发使用PhoneGap的Android应用。我需要控制在android系统后退按钮的功能。我想是如果我是一个特定的页面上，如果我触摸后退按钮会出现一个提示，询问你想退出应用程序？。我可以使用的信息帮助去了解这一点。
HTML
＆LT;！DOCTYPE HTML＆GT;
＆LT; HTML和GT;
＆LT; HEAD＆GT;
＆LT;间的charset =UTF-8＆GT;
＆LT; META NAME =视CONTENT =用户可扩展性=无，初始规模= 1，最大规模= 1，最低规模= 1，宽度=设备的宽度，高度=设备高度字符集= UTF-8/＆GT;
＆LT;链接rel =stylesheet属性HREF =主题/ theme.min.css/＆GT;
＆LT;链接rel =stylesheet属性HREF =CSS / jquery.mobile.structure-1.3.2.min.css/＆GT;
＆LT;脚本SRC =JS / jQuery的-1.10.2.min.js＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本SRC =JS / jquery.mobile-1.3.2.min.js＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本＆GT;
document.addEventListener（后退按钮，backButtonCallback，FALSE）;功能backButtonCallback（）{
navigator.notification.confirm（'你想退出应用程序吗？'，confirmCallback）;
}
功能confirmCallback（buttonIndex）{
如果（buttonIndex == 1）{
navigator.app.exitApp（）;
返回true;
}
其他{
返回false;
}
}
＆LT; / SCRIPT＆GT;＆LT; /头＆GT;
XML：
＆LT;？XML版本=1.0编码=UTF-8＆GT？;
＆所述;插件的xmlns =http://www.w3.org/ns/widgets的xmlns：间隙=http://phonegap.com/ns/1.0ID =HAP版本=1.0＆GT; ＆LT;名称＆gt;＆APP LT; /名称＆gt;
＆LT;描述＆GT;快乐互惠生＆LT; /描述＆GT;
＆LT;作者＆GT;的Myname＆LT; /笔者＆GT; ＆LT;差距：平台＆GT;
＆LT;差距：平台名称=IOS/＆GT;
＆LT;差距：平台名称=机器人/＆GT;
＆LT;差距：平台名称=webOS的/＆GT;
＆LT;差距：平台名称=symbian.wrt/＆GT;
＆LT;差距：平台名称=黑莓项目=小工具/＆GT;
＆LT; /间隙：平台＆GT;
＆LT;差距：插件名称=org.apache.cordova.dialogs/＆GT;
＆LT;图标SRC =的icon.png/＆GT;
＆LT; preference NAME =PhoneGap的版本值=3.1.0/＆GT; ＆LT;获得原产=*的子域=真/＆GT;
＆LT;获得URI =*的子域=真/＆GT;
＆LT;获得URI =http://gcccs.org子域=真/＆GT;
＆LT;功能名称=http://api.phonegap.com/1.0/network/＆GT;
＆LT;功能名称=InAppBrowser＆GT;
＆LT; PARAM NAME =Android的包值=org.apache.cordova.InAppBrowser/＆GT;
＆LT; /功能＆GT;
＆LT;功能名称=应用程序＆GT;
＆LT; PARAM NAME =Android的包值=org.apache.cordova.App/＆GT;
＆LT; /功能＆GT; ＆LT; preference NAME =方向值=肖像/＆GT;
＆LT; preference NAME =全屏VALUE =真/＆GT;
＆LT; preference NAME =目标设备值=万能/＆GT; ＆LT;图标SRC =RES /图标/安卓/图标36 ldpi.png差距：平台=Android的差距：密度=LDPI/＆GT;
＆LT;图标SRC =RES /图标/安卓/图标48 mdpi.png差距：平台=Android的差距：密度=MDPI/＆GT;
＆LT;图标SRC =RES /图标/安卓/图标-72-hdpi.png差距：平台=Android的差距：密度=华电国际/＆GT;
＆LT;图标SRC =RES /图标/安卓/图标96 xhdpi.png差距：平台=Android的差距：密度=xhdpi/＆GT;＆LT;差距：泼SRC =RES /屏幕/安卓/屏幕LDPI-portrait.png差距：平台=Android的差距：密度=LDPI/＆GT;
＆LT;差距：泼SRC =RES /屏幕/安卓/屏幕MDPI-portrait.png差距：平台=Android的差距：密度=MDPI/＆GT;
＆LT;差距：泼SRC =RES /屏幕/安卓/屏幕HDPI-portrait.png差距：平台=Android的差距：密度=华电国际/＆GT;
＆LT;差距：泼SRC =RES /屏幕/安卓/屏幕xhdpi-portrait.png差距：平台=Android的差距：密度=xhdpi/＆GT;＆LT; /部件＆GT;
解决方案
您要添加的事件侦听器的后退按钮：
document.addEventListener（后退按钮，backButtonCallback，FALSE）;
然后创建运行任何你想要的功能，当它被点击：
函数backButtonCallback（）{
navigator.notification.confirm（'你想退出应用程序吗？'，confirmCallback）;
}
然后，如果用户想要一个回调来关闭应用：
函数confirmCallback（buttonIndex）{
如果（buttonIndex == 1）{
navigator.app.exitApp（）;
返回true;
}
其他{
返回false;
}
}
此外为PhoneGap的构建你将要添加到您的config.xml文件：
＆LT;差距：插件名称=org.apache.cordova.dialogs/＆GT;
这将允许使用的确认通知。
更新：
下面是一个光模到你的HTML：
＆LT;！DOCTYPE HTML＆GT;
＆LT; HTML和GT;
＆LT; HEAD＆GT;
＆LT;间的charset =UTF-8＆GT;
＆LT; META NAME =视CONTENT =用户可扩展性=无，初始规模= 1，最大规模= 1，最低规模= 1，宽度=设备的宽度，高度=设备高度字符集= UTF-8/＆GT;
＆LT;链接rel =stylesheet属性HREF =主题/ theme.min.css/＆GT;
＆LT;链接rel =stylesheet属性HREF =CSS / jquery.mobile.structure-1.3.2.min.css/＆GT;
＆LT;脚本SRC =JS / jQuery的-1.10.2.min.js＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本SRC =JS / jquery.mobile-1.3.2.min.js＆GT;＆LT; / SCRIPT＆GT;
＆所述; SCRIPT SRC =cordova.js＆GT;
＆LT;脚本＆GT;
功能的onLoad（）{
document.addEventListener（deviceready'，deviceReady，FALSE）;
} 功能deviceReady（）{
document.addEventListener（后退按钮，backButtonCallback，FALSE）;
} 功能backButtonCallback（）{
navigator.notification.confirm（'你想退出应用程序吗？'，confirmCallback）;
}
功能confirmCallback（buttonIndex）{
如果（buttonIndex == 1）{
navigator.app.exitApp（）;
返回true;
}
其他{
返回false;
}
}
＆LT; / SCRIPT＆GT; ＆LT; /头＆GT;
＆LT;身体的onload =的onLoad（）＆GT;
您需要确保您包括 cordova.js 始终，然后用你的API做任何事情之前的事件侦听器准备好将确保科尔多瓦加载。这应该现在的工作。
I'm developing an android mobile application using jquery mobile and Phonegap. I'm new to developing android apps using Phonegap. I need to control the function of a back button in android. What I would like is if i'm on a specific page and if I touch the back button there will be a prompt asking if 'do you want to exit the app?'. I could use help on information to go about this.
HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height" charset="UTF-8"/>
<link rel="stylesheet" href="themes/theme.min.css" />
<link rel="stylesheet" href="css/jquery.mobile.structure-1.3.2.min.css" />
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/jquery.mobile-1.3.2.min.js"></script>
<script>
document.addEventListener('backbutton', backButtonCallback, false);
function backButtonCallback() {
navigator.notification.confirm('do you want to exit the app?',confirmCallback);
}
function confirmCallback(buttonIndex) {
if(buttonIndex == 1) {
navigator.app.exitApp();
return true;
}
else {
return false;
}
}
</script>
</head>
XML:
<?xml version="1.0" encoding="UTF-8"?>
<widget xmlns="http://www.w3.org/ns/widgets" xmlns:gap="http://phonegap.com/ns/1.0" id="hap" version="1.0">
<name>APP</name>
<description>Happy Au Pair</description>
<author>Myname</author> <gap:platforms>
<gap:platform name="ios" />
<gap:platform name="android" />
<gap:platform name="webos" />
<gap:platform name="symbian.wrt" />
<gap:platform name="blackberry" project="widgets"/>
</gap:platforms>
<gap:plugin name="org.apache.cordova.dialogs" />
<icon src="icon.png" />
<preference name="phonegap-version" value="3.1.0" />
<access origin="*" subdomains="true" />
<access uri="*" subdomains="true" />
<access uri="http://gcccs.org" subdomains="true" />
<feature name="http://api.phonegap.com/1.0/network"/>
<feature name="InAppBrowser">
<param name="android-package" value="org.apache.cordova.InAppBrowser" />
</feature>
<feature name="App">
<param name="android-package" value="org.apache.cordova.App" />
</feature>
<preference name="orientation" value="portrait" />
<preference name="fullscreen" value="true" />
<preference name="target-device" value="universal" />
<icon src="res/icon/android/icon-36-ldpi.png" gap:platform="android" gap:density="ldpi" />
<icon src="res/icon/android/icon-48-mdpi.png" gap:platform="android" gap:density="mdpi" />
<icon src="res/icon/android/icon-72-hdpi.png" gap:platform="android" gap:density="hdpi" />
<icon src="res/icon/android/icon-96-xhdpi.png" gap:platform="android" gap:density="xhdpi" />
<gap:splash src="res/screen/android/screen-ldpi-portrait.png" gap:platform="android" gap:density="ldpi" />
<gap:splash src="res/screen/android/screen-mdpi-portrait.png" gap:platform="android" gap:density="mdpi" />
<gap:splash src="res/screen/android/screen-hdpi-portrait.png" gap:platform="android" gap:density="hdpi" />
<gap:splash src="res/screen/android/screen-xhdpi-portrait.png" gap:platform="android" gap:density="xhdpi" />
</widget>
解决方案
You will want to add an event listener for the back button:
document.addEventListener('backbutton', backButtonCallback, false);
Then create a function to run whatever you want when it's clicked:
function backButtonCallback() {
navigator.notification.confirm('do you want to exit the app?',confirmCallback);
}
And then a callback to close the app if the user wants to:
function confirmCallback(buttonIndex) {
if(buttonIndex == 1) {
navigator.app.exitApp();
return true;
}
else {
return false;
}
}
Additionally for PhoneGap Build you will want to add this to your config.xml file:
<gap:plugin name="org.apache.cordova.dialogs" />
This will allow for the use of the confirm notification.
UPDATE:
Here is a light mod to your html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height" charset="UTF-8"/>
<link rel="stylesheet" href="themes/theme.min.css" />
<link rel="stylesheet" href="css/jquery.mobile.structure-1.3.2.min.css" />
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/jquery.mobile-1.3.2.min.js"></script>
<script src="cordova.js">
<script>
function onLoad() {
document.addEventListener('deviceready', deviceReady, false);
}
function deviceReady() {
document.addEventListener('backbutton', backButtonCallback, false);
}
function backButtonCallback() {
navigator.notification.confirm('do you want to exit the app?',confirmCallback);
}
function confirmCallback(buttonIndex) {
if(buttonIndex == 1) {
navigator.app.exitApp();
return true;
}
else {
return false;
}
}
</script>
</head>
<body onload="onLoad()">
You need to make sure you include the cordova.js always, and then using the event listener for device ready will ensure cordova is loaded before you do anything with the API. This should work now.
这篇关于jQuery Mobile的和Android设备与后退按钮build.phonegap.com的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
