touch事件

jquery mobile提供了最基本的触摸事件：touch事件

tap：
快速触摸屏幕并离开，类似于一次完整的点击事件
taphold：
触摸屏幕并保持一段时间
swipe：
在1秒内水平移动30px屏幕像素以上时触发
swipeleft：
向左侧滑动
swiperight：
向右侧滑动方向改变事件
orientationchange事件函数当移动设备方向发生改变时触发。

在事件回调函数内的第二个参数返回一个用于识别当前方向的参数，该参数只会返回两种值：portrait（纵向）和landscape（横向）

但是该事件不是所有浏览器都支持，所以使用要慎重。

滚动事件

目前jquery mobile支持两种滚动事件

scrollstart
开始滚动时触发，需要注意是ios上该事件不稳定，原因是ios在滚动时会禁止dom操作
会将dom操作放入队列中，待滚动结束后才执行这些操作，但是估计现在解决了。
scrollend
在滚动结束时触发显示/隐藏事件
在基于jquery mobile的移动web应用中，我们知道一个web页面存在多个不同的视图或页面，但每次只会显示一个。

当显示其中一个视图时其余都会隐藏，每次视图切换都会触发显示/隐藏事件

pagebeforeshow
当视图通过动画效果开始显示在屏幕之前触发事件
pagebeforehide
当视图通过动画效果开始隐藏之前触发事件
pageshow
当视图通过动画效果显示在屏幕之后触发事件
pagehide
当视图通过动画效果隐藏后触发事件

没切换一次页面，4钟事件都会被触发，例如：
当a视图切换到b视图时，首先触发a视图的pagebeforeshow事件和b视图的pagebeforehide事件
当b视图完成切换动画效果后完整的显示在屏幕中时，会触发a视图的pagehide事件和b视图的pageshow事件虚拟鼠标事件
jquery mobile提供了一种虚拟点击事件来整合不同设备中mouse和touch事件

vmouseover
统一处理触摸和鼠标悬停事件
vmousedown
统一处理触摸和鼠标按下事件
vmousemove
处理触摸和鼠标移动事件
vmouseup
处理触摸和鼠标松开事件
vclick
处理触摸和鼠标点击事件
vmousecancel
处理触摸和鼠标离开事件

简单的页面实例

在引入 jQuery Mobile 需要的组件后，我们可以创建 jQuery Mobile 页面，下面给出一个简单的例子。

对于 jQuery Mobile ，每定义一个 data-role="page" 就相当于一个页面， jQuery Mobile 默认采用 Ajax 的方式操作 DOM，自动隐藏除第一个页面外的所有页面，当点击链接，链接到其他页面时会以 Ajax 的方式加载新页面的内容，下面给出完整实例。另外，我们还可以使用一些 HTML5 的语义化标签，如 header 的 div 可以直接使用 header 标签，具体的可以参见下面的例子。

（建议使用 PC 上的 Firefox、Chrome 等现代浏览器和 IE9+ 或 Android , iPhone/iPad 的系统浏览器浏览）