没事开发一个phonegap通讯录使用:
js如下:
//调用手机通讯录的方法 function queryContactList() { var options = new ContactFindOptions(); var fields=["id","name","displayName", "phoneNumbers","emails"]; //options.filter=getParameterByName("id"); options.multiple=true ; //调用phonegap的手机通讯信息的方法 navigator.contacts.find(fields,showContact, onError, options); } //调用失败的通知 function onError(fail) { alert(fail); } //调用成功处理方式 function showContact(contacts) { var sb=new StringBuffer(); sb.append("<ul data-role='listview' data-inset='true' data-icon='plus' >"); var temp=new StringBuffer(); for (var i=0;i<contacts.length;i++) { var diaplayName=contacts[i].displayName; if(diaplayName==''||diaplayName==null){ diaplayName=contacts[i].name; if(diaplayName==''||diaplayName==null){ diaplayName=contacts[i].nickname; if(diaplayName==''||diaplayName==null){ diaplayName=contacts[i].givenName+" "+contacts[i].familyName; } } } var phoneNumber=contacts[i].phoneNumbers[0].value; temp.append("<li><div class='ui-grid-a'><div class='ui-block-a'>"+contacts[i].displayName+"</div><div class='ui-block-b'>"+phoneNumber+"</div></div></li>"); } //当前通讯没有信息的提示信息 if(temp.toString("")==''){ temp.append("<li>通讯录没有通讯信息!</li>"); } sb.append(temp.toString("")); sb.append("</ul>"); $("#telContactList").html(sb.toString("")); $("div[data-role=content] ul").listview(); }
utils.js代码如下:
//模仿java的StringBuffer的javascript的实现 function StringBuffer() { this._strs = new Array; } StringBuffer.prototype.append =function(str) { this._strs.push(str); }; StringBuffer.prototype.toString = function(separate) { return this._strs.join(separate); };
html页面如下:
<!DOCTYPE html>
<html>
<head>
<title>通讯录信息</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="format-detection" content="telephone=no"/>
<script src="jquery.mobile/jquery-1.6.4.min"></script>
<script src="jquery.mobile/jquery.mobile-1.0.1.js"></script>
<link rel="stylesheet" href="jquery.mobile/jquery.mobile-1.0.1.css" />
<script src="phonegap-1.4.1.js"></script>
<script src="jquery.mobile/contact.js"></script>
<script src="jquery.mobile/utils.js"></script>
<script>
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
queryContactList();
}
</script>
</head>
<body>
<div data-role="page" id="mainTrainIndex" data-theme="b" >
<!-- header -->
<div data-role="header" data-position="fixed" >
<h1>通讯录信息</h1>
</div>
<!-- content -->
<div data-role="content" data-theme="b" >
<div id="telContactList"></div>
</div>
</div>
</body>
</html>