近期由于公司項目需要開發html5移動應用，是以去了解了html5移動應用開發架構，實作如何調用原生元件如（GPS定位、調用相機、錄音、撥打電話、發短信等功能）就目前移動開發架構中Phonegap的表現還是令人滿意的，以上的功能需求都可以實作，還可以自定義插件等，下面我就帶大家一起寫一個自定義的撥打電話發短信的插件。關于Phonegap開發環境搭建在本文中就先不涉及，大家可以借助搜尋引擎都可以找到相關教程，之後有時間會給出開發環境搭建教程。（注：本文對應Phonegap3.6版本）
此文章同步于我的個人部落格網站：http://www.fengchaokm.com/
先給出頁面截圖吧，頁面比較簡單，由一個文本輸入框和兩個按鈕組成
<body>
<div class="app">
<input class="phonenumber" type="text" id="phonenumber" placeholder="請輸入手機号碼" />
<h2><button class="phonegapstyle" οnclick="call();">打電話</button></h2>
<h2><button class="phonegapstyle" οnclick="sms();">發短信</button></h2>
</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript">
app.initialize();
function call(){
window.phoneplugin.call(document.getElementById("phonenumber").value);
};
function sms(){
window.phoneplugin.sms(document.getElementById("phonenumber").value);
};
</script>
</body> 項目檔案目錄結構：
首先我們來編寫插件Java代碼：
接下來我們編寫PhonePlugin.js代碼：
然後找到res/xml/config.xml檔案進行相關配置：
<feature name="PhonePlugin"> //name屬性為類名
<param name="android-package" value="org.apache.cordova.pluginutils.PhonePlugin" /> //value 屬性為Java檔案包名+類名
</feature>
然後我們在www目錄下找到cordova_plugin.js檔案進行如下配置：
到此phonegap插件開發已經完成，是不是很簡單啊，最後隻要在頁面上調用即可！