jQuery Mobile 教程
1. jQuery Mobile 教程 2. jQuery Mobile 简介 3. jQuery Mobile 安装 4. jQuery Mobile 页面 5. jQuery Mobile 过渡 6. jQuery Mobile 按钮 7. jQuery Mobile 按钮图标 8. jQuery Mobile 工具栏 9. jQuery Mobile 导航栏 10. jQuery Mobile 可折叠块 11. jQuery Mobile 网格 12. jQuery Mobile 列表视图 13. jQuery Mobile 列表内容 14. jQuery Mobile 表单 15. jQuery Mobile 表单输入 16. jQuery Mobile 表单选择 17. jQuery Mobile 表单滑动条 18. jQuery Mobile 主题 19. jQuery Mobile 事件 20. jQuery Mobile 触摸事件 21. jQuery Mobile 滚屏事件 22. jQuery Mobile 方向改变事件 23. jQuery Mobile 实例 24. jQuery Mobile Data 属性 25. jQuery Mobile 图标 26. jQuery Mobile页面事件 27. jQuery Mobile CSS 类

jQuery Mobile 事件

jQuery Mobile 事件


事件 = 所有不同访问者访问页面的响应动作。


jQuery Mobile 事件

在jQuery Mobile你可以使用任何标准的 jQuery 事件

除此之外, jQuery Mobile 也提供了针对移动端浏览器的事件:

  • 触摸事件 - 当用户触摸屏幕时触发
  • 滑动事件 - 当用户上下滑动时触发
  • 定位事件 - 当设备水平或垂直翻转时触发
  • 页面事件 - 当页面显示,隐藏,创建,加载或未加载时触发

初始化 jQuery Mobile 事件

在学习jQuery时我们学到了用$(document).ready()来使你的jQuery代码脚本在DOM元素加载完成后才开始执行:

jQuery document ready 事件

<script>
$(document).ready(function(){

   // 编写jQuery方法...

});
</script>

55面试教程网 »

但是,在 jQuery Mobile 中, 使用pageinit 事件来设置代码脚本在DOM元素加载完成后开始执行,所以要在任何新页面加载并创建是执行脚本,就需要绑定pageinit事件。

第二个参数 ("#pageone")为指定事件的页面id:

jQuery Mobile pagecreate 事件

<script>
$(document).on("pagecreate","#pageone",function(){

   // jQuery 事件...

});
</script>

55面试教程网 »

 注意: jQuery on() 方法用于绑定事件到选中的元素上。

下一章节我们将更详细介绍 jQuery Mobile 事件。