# 事件 Jquery Mobile提供了一些建于本地事件的自定义事件以用来创建一些有用的钩子. 要注意这些事件是建立于各种已存在的触摸事件之上，比如 鼠标和窗口事件，所以你可以通过使用 live() 或者 bind()将他们绑定到其他的Jquery事件 ## 触摸事件 Touch events **tap(轻击)：一次快速完整的轻击后触** **taphold（轻击不放）：轻击并不放（大约一秒）后触** **swipe(划动)：一秒内水平拖拽大于30PX，同时纵向拖曳小?0px的事件发生时触发** **swipeleft（左划）：划动事件为向左的方向时触发** **swiperight（右划）：划动事件为向右的方向时触发** ## 设备方向变化事件 Orientation change event **orientationchange** 当设备的方向变化（设备横向持或纵向持）此事件被触发。绑定此事件时，你的回调函数可以加入第二个参数，作用为描述设备横或纵向的属性，"portrait"?quot;landscape"。这些值也会作为class值加入到html的元素中，使你可以通过css中的选择器改变他们的样式。注意当浏览器不支持orientationChange事件的时候可以通过resize 事件绑定 ## 滚屏事件 Scroll events **scrollstart** 当屏幕滚动开始的时候触发。苹果的设备会在滚屏时冻结DOM的操作，当滚屏结束时按队列执行这些dom操作，我们现在正在研究方法让苹果的设备在滚屏开始前执行dom操作 **scrollstop** 滚屏结束时触发 ## 滚屏事件 Scroll events **scrollstart** 当屏幕滚动开始的时候触发。苹果的设备会在滚屏时冻结DOM的操作，当滚屏结束时按队列执行这些dom操作，我们现在正在研究方法让苹果的设备在滚屏开始前执行dom操作 **scrollstop** 滚屏结束时触发 ## 页面显示/隐藏事件 Page show/hide events 在Jquery Mobile中，无论页面显示或是隐藏，都在该页面触发两个事件。哪个事件被触发取决于页面被显示还是隐藏，所以当页面转场发生时，实际?个事件被触发了，每个页面有两个： pagebeforeshow：转场之前，页面被显示时触发 pagebeforehide：转场之前，页面被隐藏时触发 pageshow：转场之后，页面被显示时触发 pagehide：转场之后，页面被隐藏时触发 请注意这4个事件都引用了”上一页“，或”下一页“，这取决于哪一页被显示或者隐藏，以及”上一页“或者”下一页“是否存在。（第一个被显示的page并没?quot;上一?quot;可以引用，但是同样会引用一个空的Jquery对象 ），你可以通过将第二个参数作为一个绑定的回调函数访问这一引用 ``` $('div').live('pageshow',function(event, ui){ 　alert('This page was just hidden: '+ ui.prevPage); }); $('div').live('pagehide',function(event, ui){ 　alert('This page was just shown: '+ ui.nextPage); }); ``` 而且，务必在 Jquery Mobile 执行前绑定这些函数，以使 他们在初始化页面加载时被调用。在 mobileinit 事件的处理函数中使用它们既可，详情参?a href="globalconfig.html">global config ## 页面初始化事件 Page initialization events Jquery Mobile会自动基于page"内的增强的约定自动初始化一些插件?例如：给一个input输入框约定了type=range属性会自动生成一个自定义滑动条 这些自动初始化的行为是受"page"插件控制的，它在执行前后部署部署事件，允许你在初始化前后操作页面，或者甚至自己提供初始化行为，禁止自动初始化。注以下的页面初始化事件在每个“page”只被触发一次，而显?隐藏 事件则不同，在页面显示或者隐藏的每次，它们都会被触发 pagebeforecreate：页面初始化时，初始化之前触 pagecreate：页面初始化时，初始化之后触 ``` $('#aboutPage').live('pagebeforecreate',function(event){ alert('This page was just inserted into the dom!'); }); $('#aboutPage').live('pagecreate',function(event){ alert('This page was just enhanced by Jquery Mobile!'); }); ``` 注意：通过绑定pagebeforecreate然后return false，你禁止页面插件自己的操作 而且，务必在 Jquery Mobile 执行前绑定这些函数，以使 他们在初始化页面加载时被调用。在 mobileinit 事件的处理函数中使用它们既可，详情参?a href="globalconfig.html">global config ## 动画事件 Animation Events Jquery Mobile提供了animationComplete 插件，你可以用来添加或删除一个class来应用CSS转场效果