一、设备信息
device.name 设备名称
device.cordova PhoneGap 版本
device.platform 设备平台
device.uuid uuid 编码
device.version 平台版本
<script type="text/javascript">
$(document).ready(function(){
document.addEventListener("deviceready", myDeviceReadyListener, false);
});
function myDeviceReadyListener(){
$("#deviceName .ui-btn-text").text("设备名称" + device.name);
$("#deviceCordova .ui-btn-text").text("PhoneGap 版本" + device.cordova);
$("#devicePlatform .ui-btn-text").text("设备平台" + device.platform);
$("#deviceUUID .ui-btn-text").text("uuid 编码" + device.uuid);
$("#deviceVersion .ui-btn-text").text("平台版本" + device.version);
}
</script>
</head>
<body>
<div data-role="page">
<div data-role="header">
<h1>PhoneGap 实战</h1>
</div>
<div data-role="content">
<a href="#" data-role="button" id="deviceName"></a>
<a href="#" data-role="button" id="deviceCordova"></a>
<a href="#" data-role="button" id="devicePlatform"></a>
----------------------- Page 2-----------------------
<a href="#" data-role="button" id="deviceUUID"></a>
<a href="#" data-role="button" id="deviceVersion"></a>
</div>
<div data-role="footer">
<h4> </h4>
</div>
</div>
</body>
二、网络连接
Phonegap 网络连接通过navigator.network.connection.type 来获取，一般有一下几种状态
1. Connection.UNKNOWN 未知连接
2. Connection.ETHERNET 以太网
3. Connection.WIFIWiFi
4. Connection.CELL_2G2G 网络
5. Connection.CELL_3G3G 网络
6. Connection.CELL_4G 4G 网络
7. Connection.NONE 无网络连接
<!DOCTYPE html>
<html>
<head>
<title>Device Properties Example</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8">
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
// 监听网络的变化
window.addEventListener("online", onOnline, false);
window.addEventListener("offline", onOffline, false);
// 检查网络连接
checkNetworkConnection();
}
function checkNetworkConnection() {
var states = {};
states[Connection.UNKNOWN] = '未知连接';
states[Connection.ETHERNET] = ' 以太网';
states[Connection.WIFI] = 'WiFi';
----------------------- Page 3-----------------------
states[Connection.CELL_2G] = '2G 网络';
states[Connection.CELL_3G] = '3G 网络';
states[Connection.CELL_4G] = '4G 网络';
states[Connection.NONE] = '无网络连接';
alert('网络连接类型: ' + states[navigator.network.connection.type]);
}
function onOnline() {
alert('您现在在线');
}
function onOffline() {
alert('您现在离线');
}
</script>
</head>
<body>
<p>检查网络类型的例子</p>
<input type="button" value="检查网络""checkNetworkConnection()" />
</body>
</html>
三．通知
notification.alert 提示对话框
notification.confirm 确认对话框
notification.prompt 该notification.prompt 方法显示一个对话框，比本地浏览器的提
示功能更强大。
notification.beep 发出嘟嘟的声音
notification.vibrate 震动
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>PhoneGap-Notification</title>
<link rel="stylesheet" href="../jquery.mobile-1.1.1/jquery.mobile-1.1.1.css" />
<script src="../jquery.mobile-1.1.1/jquery.js"></script>
<script src="../jquery.mobile-1.1.1/jquery.mobile-1.1.1.js"></script>
<script type="text/javascript" charset="utf-8" src="../cordova-1.9.0.js"></script>
<script type="text/javascript">
$(document).ready(function(){
----------------------- Page 4-----------------------
document.addEventListener("deviceready", myDeviceReadyListener, false);
});
function myDeviceReadyListener(){
$("#NoAlert").click(function(){
navigator.notification.alert("这是一个提醒",function(){
console.log("确认了!");
},"标题","确认");
});
$("#NoConfirm").click(function(){
navigator.notification.confirm("请问你吃饭了吗?",function(info){
console.log("你选择了" + info);
},"请确认","吃了,没吃");
});
$("#NoBeep").click(function(){
navigator.notification.beep(3);
});
$("#NoVibrate").click(function(){
navigator.notification.vibrate(3000);
});
}
</script>
</head>
<body>
<div data-role="page">
<div data-role="header">
<h1>PhoneGap 实战</h1>
</div>
<div data-role="content">
<a href="#" data-role="button" id="NoAlert">弹出提示框</a>
<a href="#" data-role="button" id="NoConfirm">弹出确认框</a>
<a href="#" data-role="button" id="NoBeep">提示音</a>
<a href="#" data-role="button" id="NoVibrate">震动</a>
</div>
<div data-role="footer">
<h4> </h4>
</div>
</div>
</body>
----------------------- Page 5-----------------------
</html>
