标签：
做页面之前首先引用三个文件：
<link href="/Scripts/jquery.mobile-1.4.5/jquery.mobile-1.4.5.css" rel="stylesheet" /> <script src="/Scripts/jquery-1.10.2.min.js"></script> <script src="/Scripts/jquery.mobile-1.4.5/jquery.mobile-1.4.5.min.js"></script>
因为JqueryMobile必须jquery的基础上才能使用，所以要先引用jquery.js，再引用JqueryMobile.js
定义样式，效果之类的，都是通过data-xx来实现的，首先介绍data-role：
<body> <div data-role="page"> <div data-role="header"> <h1>欢迎访问我的主页</h1> </div> <div data-role="content"> <p>我是一名移动开发者！</p> </div> <div data-role="footer"> <h1>页脚文本</h1> </div> </div> </body>
data-role的一些取值
page：整个页面，所有的元素都要在这个容器中
header：页面上方的工具栏，如标题、搜索框
content：页面内容
footer：页面底部的工具栏
JqueryMobile中的页面跳转：
定义两个div data-role="page"，分别加上不同的id
然后用a href="#id" 实现跳转
<div data-role="page" id="pageone"> <div data-role="content"> <a href="#pagetwo">转到页面二</a> </div> </div> <div data-role="page" id="pagetwo"> <div data-role="content"> <a href="#pageone">转到页面一</a> </div> </div>
如果希望以对话框的形式跳转
给a标签加上 data-rel="dialog"
通过个a标签加一个data-transition属性来实现，不写是默认淡出淡入
fade 默认。淡出淡入
flip 从后向前翻动到下一页
flow 抛出当前页面，引入下一页
slide 从右向左滑动到下一页
.....具体百度
如果希望slide从左向右滑动（相反的方向）, 再给a标签加一个属性：data-direction="reverse"
推荐使用<a data-role="button"></a>来创建页面之间的链接
<input> 或 <button> 元素用于表单提交
按钮默认会占据整行的宽度，如果希望多个按钮并排显示，需要给按钮添加属性data-inline="true" (行内按钮)
给父级div加 data-role="controlgroup" ， 并且添加data-type="horizontal | vertical"的其中一个值
<div data-role="controlgroup" data-type="horizontal"> <a href="#anylink" data-role="button">按钮 1</a> <a href="#anylink" data-role="button">按钮 2</a> <a href="#anylink" data-role="button">按钮 3</a> </div>
给按钮添加属性 data-rel="back" 会成为后退按钮并忽略href属性。
给按钮添加属性 data-icon 会成为图标按钮，其取值为：
arrow-l 左箭头
delte 删除
search 搜索
...具体百度
同时图标的位置可以设置为上下左右，默认是左
通过属性data-iconpos设置，其取值有4个：
top 上
bottom 下
left 左
left 右
notext 只要图标不要文字
标签：
原文地址：http://www.cnblogs.com/dengshaojun/p/4552589.html
