iOS开发交流群:484884085
欢迎大家加入!
接上一篇文章,本部分实现js部分
config.xml文件中插入下面代码,建立原生与js之间的桥接
<feature name="GetDeviceInfo">
<param name="ios-package" value="CDVGetDeviceInfo" />
</feature>
js的目录结构如上图所示,需要用到三个文件,device.html、device.js、jquery-1.12.4.min(这个可以直接去官网下载)。下面提供html的文件内容和js文件的内容
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
<title>Cordova</title>
<script type="text/javascript" src="js/device.js"></script>
<script type="text/javascript" src="../jquery-1.12.4.min.js"></script>
<script type="text/javascript" src="../cordova.js"></script>
</head>
<body>
<div data-role="page" data-theme="s">
<div data-role="content">
<ul data-role="listview" data-dividertheme="b">
<li><a href="javascript:Cordova_getDeviceInfo()">getDeviceInfo</a></li>
</ul>
</div>
</div>
<div data-role="page" id="DeviceResult" data-theme="s">
<div data-role="header" data-position="fixed">
<h1 data-role="label">DeviceResult</h1>
</div>
<div data-role="content">
<ul data-role="listview" data-dividertheme="b" id="resultList">
</ul>
</div>
</div>
</body>
</html>
function Cordova_getDeviceInfo() {
cordova.exec( function(deviceInfo) {
var lstResult = "";
$('#resultList').empty();
lstResult += "<li>设备名称 : " + deviceInfo.name + "</li>";
lstResult += "<li>设备型号 : " + deviceInfo.model + "</li>";
lstResult += "<li>本地型号 : " + deviceInfo.localizedModel + "</li>";
lstResult += "<li>系统名称 : " + deviceInfo.systemName + "</li>";
lstResult += "<li>系统版本 : " + deviceInfo.systemVersion + "</li>";
lstResult += "<li>广告标识符 : " + deviceInfo.identifierForVendor + "</li>";
lstResult += "<li>当前语言 : " + deviceInfo.languages + "</li>";
lstResult += "<li>存储空间 : " + deviceInfo.totalSize + "</li>";
lstResult += "<li>可用空间 : " + deviceInfo.freeSize + "</li>";
lstResult += "<li>电池余量 : " + deviceInfo.level + "</li>";
lstResult += "<li>是否充电 : " + deviceInfo.isCharging + "</li>";
$('#resultList').html(lstResult);
$('#resultList').listview('refresh');
},
function(error) {
var lstResult = "出错了..";
$('#resultList').html(lstResult);
$('#resultList').listview('refresh');
},
"GetDeviceInfo", "deviceInfo", ["1","2"]
);
};
module.exports = Cordova_getDeviceInfo();
以上代码放进去之后,在config.xml的文件里面,将启动页面设置为device.html运行后即可