您的位置:首页 > 其它

跨平台移动开发_PhoneGap API 事件类型

2013-11-14 09:10 225 查看
PhoneGap API Events

backbutton
deviceready
menubutton
pause
resume
online
offline
batterycritical
batterylow
batterystatus
volumedownbutton
volumeupbutton

点击下载源代码包



参考代码

<!DOCTYPE html>
<html>
<head>
<title>
PhoneGap Device Ready Example
</title>
<link
href="content/css/themes/default/jquery.mobile.structure-1.4.0-beta.1.min.css"
rel="stylesheet"
type="text/css"/>
<link href="content/css/themes/default/jquery.mobile-1.4.0-beta.1.min.css" rel="stylesheet" type="text/css"/>

<script src="content/js/jquery.js" type="text/javascript">
</script>
<script src="content/js/jquery.mobile-1.4.0-beta.1.js" type="text/javascript">
</script>
<script src="content/js/cordova.js" type="text/javascript">
</script>

<script type="text/javascript">
$(function(){
//当PhoneGap被完全加载后会触发该事件。
document.addEventListener('deviceready',onDeviceReady,false);
})
function onDeviceReady() {
// 现在可以安全使用PhoneGap API
//alert('deviceready');
console.log('deviceready');
//当PhoneGap应用程序被放到后台的时候触发此事件。
document.addEventListener('pause', onPause, false);
//当PhoneGap应用程序被恢复到前台运行的时候触发此事件。
document.addEventListener('resume', onResume, false);
//当用户在Android系统上点击后退按钮的时候触发此事件。
document.addEventListener('backbutton', onBackButton, false);
//当用户在Android系统上点击菜单按钮的时候触发此事件。
document.addEventListener('menubutton', onMenuButton, false);
//当PhoneGap应用程序离线(没有连接到因特网)的时候触发此事件。
document.addEventListener('offline', isOffline, false);
//当PhoneGap应用程序在线(连接到因特网)的时候触发此事件。
document.addEventListener('online', isOnline, false);
//当PhoneGap应用程序发现电池电量降低到临界点时会触发此事件。
window.addEventListener('batterycritical', onBatteryCritical, false);
//当PhoneGap应用程序发现电池降到一个较低水平值时触发此事件。
window.addEventListener('batterylow', onBatteryLow, false);
//当PhoneGap应用程序发现电池状态发生改变时触发此事件。
window.addEventListener('batterystatus', onBatteryStatus, false);
//当用户按下加大音量按钮时会触发该事件。
document.addEventListener('volumeupbutton', onVolumeUpKeyDown, false);
}
//统计点击数量
var backbuttoncount=0;
var menubuttoncount=0;
var volumeupbuttoncount=0;
function onPause(){
console.log('onPause');
}
function onResume(){
console.log('onResume');
}
function onBackButton() {
console.log('onBackButton');
backbuttoncount++;
$('#backbuttoncount').text('后退按钮点击'+backbuttoncount+'次');
}
function onMenuButton() {
console.log('onMenuButton');
menubuttoncount++;
$('#menubuttoncount').text('菜单按钮点击'+menubuttoncount+'次');
}
function isOffline() {
console.log('Offline');
$('#ispson').text('没有连接到因特网');
}
function isOnline() {
console.log('isOnline');
$('#ispson').text('连接到因特网');
}
function onBatteryCritical(info) {
//处理电池电量不足的事件。
alert("电池电量不足" + info.level + "%");
}
function onBatteryLow(info) {
// 处理电池电量低的事件
alert("电池电量低 " + info.level + "%");
}
function onBatteryStatus(info) {
// 处理电池状态发生改变的事件
console.log("电池状态: " + info.level + " 是否充电: " + info.isPlugged);
$('#batteryinfo').text('电池状态:'  + info.level + '是否充电: '  + info.isPlugged);
}
function onVolumeUpKeyDown() {
// 处理声音增大按钮事件
console.log('onVolumeUpKeyDown');
volumeupbuttoncount++;
$('#volumeupbuttoncount').text('声音增大按钮点击'+volumeupbuttoncount+'次');
}
</script>
</head>
<body>
<div data-role="page" id="page">
<h1>
Events效果
</h1>

<label for="textinput-disabled">
[后退按钮]:
</label>
<a href="#" data-role="button" id="backbuttoncount">
次数
</a>
<label for="textinput-disabled">
[菜单按钮]:
</label>
<a href="#" data-role="button" id="menubuttoncount">
次数
</a>
<label for="textinput-disabled">
[声音增大按钮]有些平台不支持:
</label>
<a href="#" data-role="button" id="volumeupbuttoncount">
次数
</a>
<a href="#" data-role="button" id="batteryinfo">
电池状态
</a>
<a href="#" data-role="button" id="ispson">
网络连接状态
</a>
</div>
</body>
</html>


参考中文API文档:http://www.phonegapcn.com/events

声明:本博客高度重视知识产权保护,发现本博客发布的信息包含有侵犯其著作权的链接内容时,请联系我,我将第一时间做相应处理,联系邮箱ffgign@qq.com
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐