其实二者并不影响，PhoneGap负责调用系统的接口，jQuery Mobile实现一些网页效果。PhoneGap开发请看上一篇文章，jQuery Mobile开发环境搭建如下：【请先阅读上一篇文章，这一篇文章是在上一篇的基础上进行的】

一、到jquerymobile.com下载最新的ZIP File，解压得到其JavaScript, CSS和images。放到/assets/www/js目录下。如图：【其中jquery.js是从demos的js目录里复制出来的，上一篇文章中的cordova.js也移到了js目录下】

jQuery Mobile和PhoneGap混合开发_html

二、在index.html中加入如下代码：

 

<link rel="stylesheet" type="text/css" href="js/jquery.mobile-1.3.1.css">  
	<script src="js/jquery.js"></script>  
	
	<!-- 这里加入项目中其他的引用 -->  
	<script type="text/javascript" charset="utf-8" src="js/cordova.js"></script>
	
	<script src="js/jquery.mobile-1.3.1.js"></script>


注意顺序。

 

三、在</head>之前加入<meta charset="UTF-8"> 以支持中文。

四、到http://view.jquerymobile.com/1.3.1/dist/demos/去把一些demo复制过来运行一下看看效果吧~

 

jQuery Mobile和PhoneGap混合开发_css_02