jQueryMobile进阶（1）

标签：style   blog   http   java   color   使用   

转自：http://mobile.51cto.com/web-315568.htm

      目前,jQuery Mobile是在HTML5 移动开发中的一个很不错的框架,它为熟悉Jquery的开发者进行移动开发提供了很大方便。jQuery Mobile使用的是HTML5和CSS3，除了能提供很多基础的移动页面元素开发功能外，框架自身还提供了很多可供扩展的API,以供开发者扩展 jQuery Mobile框架本身的功能。

准备工作

请先下载最新版本的jQuery Mobile框架(下载地址为http://jquerymobile.com/ )。

全局设置

下面的这些jQuery Mobile列出的API，允许开发者更改其框架的默认事件行为

1. 继承扩展jQuery Mobile的初始化事件
2. 创建自定义命名空间
3. 页面初始化
4. 自定义子页的KEY
5. 设置当前激活页的样式
6. 设置默认页和对话框效果
7. 自定义加载和自定义显示错误信息

下面逐一进行介绍

继承扩展jQuery Mobile的初始化事件

jQuery Mobile中包含了一个初始化的事件，该事件在jQuery框架的document.ready事件加载前就能被加载，名字叫mobileinit。这 就允许开发者继承和扩展jQuery Mobile的默认全局选项。为了继承和扩展mobileinit事件，只需要将自定义的Javascript事件处理程序脚本放在jQuery Mobile库加载前进行加载即可，但要注意放在jQuery框架本身后进行加载，如下代码所示：

然后，为了扩展mobileinit事件，必须首先使用jquery的bind事件将自定义方法和

Mobileinit事件绑定，如下所示：

<script src="../js/jquery-1.9.1.min.js"></script> 
<script type="text/javascript">
    $(document).bind("mobileinit",function(){
        alert("mobile init");
    });
</script>
<script src="../js/jquery.mobile-1.4.2.min.js"></script>
        

接下来，就可以使用jQuery的extend方法去继承$mobile对象，然后可以简单地通过属性=值的方法重新设置jQuery Mobile的新的全局属性，如下代码：

$(document).bind("mobileinit",function(){
     $.extends($.mobile,{
         property=value
     });
});

如果仅是设置一个属性值，则也可以使用如下代码实现，而不需要继承$mobile对象：

$(document).bind("mobileinit", function() { 
    $.mobile.property = value; 
});

可以看到$.mobile对象为设置所有属性的入口点。

jQueryMobile进阶（1）,布布扣,bubuko.com

jQueryMobile进阶（1）

标签：style   blog   http   java   color   使用   

原文地址：http://www.cnblogs.com/sunyt/p/3819657.html