在现在的智能手机中,都有对方向变换的自动感知功能,比如当手机方向从水平方向切换到垂直方向时,则会触发该事件。在jQuery Mobile中,可以通过orientationchange事件进行绑定,并且可以设定是垂直方向还是水平方向,如下代码所示:

  $(document).ready(function(){

  $('body').bind('orientationchange', function(event) {

  alert('orientationchange: '+ event.orientation);

  });

  });

  在上面的代码中,通过对body元素绑定orientationchange事件,并显示出当前的orientation属性。但要注意的是,即使在DOM加载完后,还是应该重新调用该事件,因为在DOM加载时有时可能orientationchange事件还没能完全加载完毕,所以应该按如下的方法在ready加载后,再加载一次:

  $(document).ready(function(){

  $('body').bind('orientationchange', function(event) {

  alert('orientationchange: '+ event.orientation);

  });

  $('body').trigger('orientationchange');

  });

jQuery Mobile方向感应事件的更多相关文章

  1. JQuery Mobile - 为什么绑定事件后会被多次执行?

    JQuery Mobile 在绑定事件时候,发现会被多次执行,为什么啊? 原来,jquery click  不是替换原有的function ,而是接着添加,所以才会执行次数越来越多,怎么办才能按需实现 ...

  2. jQuery Mobile 入门基础教程

    jQuery Mobile是jQuery在手机上和平板设备上的版本.jQuery Mobile 不仅会给主流移动平台带来jQuery核心库,而且会发布一个完整统一的jQuery移动UI框架. jQue ...

  3. [转]使用 jQuery Mobile 与 HTML5 开发 Web App —— jQuery Mobile 事件详解

    在前文<使用 jQuery Mobile 与 HTML5 开发 Web App —— jQuery Mobile 默认配置与事件基础>中,Kayo 对 jQuery Mobile 事件的基 ...

  4. jquery mobile 对手势触控提供了如下几个事件监听:

    jquery mobile 对手势触控提供了如下几个事件监听: 复制代码代码如下: tap  当用户点屏幕时触发taphold 当用户点屏幕且保持触摸超过1秒时触发swipe 当页面被垂直或者水平拖动 ...

  5. jQuery Mobile里xxx怎么用呀? (事件篇)

    jQuery Mobile里$(document).ready()怎么用呀? 相关链接: http://stackoverflow.com/questions/14468659/jquery-mobi ...

  6. jquery mobile Touch事件

    Touch事件在用户触摸屏幕(页面)时触发 1.jquery mobile tap tap事件在用户敲击某个元素时触发 $("p").on("tap",fucn ...

  7. jQuery Mobile Api

        jQuery Mobile提供了使用Javascript与框架(html5)通信以及进行内容管理的API.下面介绍具体事件. 文档事件     mobileinit事件会在jQuery Mob ...

  8. jQuery Mobile Data 属性

    按钮 带有 data-role="button" 的超链接.button 元素.工具栏中的链接以及 input 字段都会自动渲染成按钮样式,不需要添加 data-role=&quo ...

  9. jQuery Mobile 所有data-*选项,开发全解+完美注释

    全栈工程师开发手册 (作者:栾鹏) jQuery Mobile事件全解 jQuery Mobile 所有class选项 jQuery Mobile 所有data-*选项 jQuery Mobile 所 ...

随机推荐

  1. Jquery.Validate验证CheckBoxList,RadioButtonList,DropDownList是否选中

    http://blog.csdn.net/fox123871/article/details/8108030 <script type="text/javascript"&g ...

  2. [jobdu]数组中的逆序对

    http://ac.jobdu.com/problem.php?pid=1348 数组中的逆序对也是个常见的题目,算法导论中也有一些描述,参考:http://www.cnblogs.com/wuyue ...

  3. java web路径的问题

    对于<form action="/xx"> 和 <a href='/xx'> 其中,xx相应的为网站根目录 一般网站为虚拟目录,所以要 写成   /web应 ...

  4. Android 导出db并查看内容

    1.导出sqlite的db文件: 使用工具DDMS,切换到DDMS,显示File Explorer窗口,找到/data/data/应用名/databases/数据库名,点击导出按钮,导出文件. 2.使 ...

  5. python 检测文件编码等

    参考:http://my.oschina.net/waterbear/blog/149852 chardet模块,能够实现文本编码的检查, 核心代码: import chardet chardet.d ...

  6. 【POJ】1692 Crossed Matchings

    经典DP,想了很久,开始想复杂了. #include <iostream> using namespace std; #define MAXNUM 100 int mymax(int a, ...

  7. Visual Studio中的项目属性-->生成-->配置

    1.Debug配置 2.Release配置 2.Debug和Release的区别 (1)Debug有定义DEBUG常量,Release没有 (2)Debug没有优化代码,Release有 (3)生成路 ...

  8. OSFM Tables

    OSFM - Oracle Shop Floor Management 1. (N) Shop Floor Manager > Lot Based Jobs (B: New) Status: U ...

  9. 先贴出代码C++ 中的单例模式

    先贴出代码,代码后面是讲解 自己编写的单例模式: #include <iostream> #include <stdio.h> #include <string> ...

  10. lnmp.org一键安装包

    LNMP安装快速导航:LNMP安装提示,LNMP安装教程.安装失败处理.虚拟主机管理.可选组件.LNMP文件目录说明.状态管理. 系统需求: CentOS/Debian/Ubuntu Linux系统 ...