jquerymobile操作html5的常用函数总结

《jquerymobile操作html5的常用函数总结》由会员上传分享，免费在线阅读，更多相关内容在学术论文-天天文库。

1、jQueryMobile操作HTML5的常用函总结jQueryMobile是针对移动端开发的JavaScript框架，正如其名基于jQuery库，jQueryMobile主要被用来操作HTML5设计页面UI，下面就来看一下jQueryMobile操作HTML5的常用函数总结：一•mobile.changePage()amp:$.mobile.loadPage()1.$.mobile,changePage()$.mobile,changePage()方法会在页面加载时自动调用，若这个页面为当前文档中的不同"page"，则会转到这个新

2、页面隐藏旧页面；若这个页面为外部页面，即页面与当前页面不在同一文档中(本质上是新页面不在当前DOM中)，$.mobile.changePage()首先会调用$•mobile.loadPage()把外部页面的元素插入到DOM中，再显示新页面。这也是对页面加载过程的简单复述。$.mobile.changePage()有两个参数to(stringorobject,必须)和options(object,可选)，具体如下:(1)to(stringorobject，必须)to为必要参数，其值可以为string(字符串，如"about/us.h

3、tml〃)或object(对象，如$(〃#about〃))，这主要是面向两种不同的页面，string形式的为外部页面链接，而object为同一文档中的不同〃page〃，如〃ttpage2〃，$.mobile.changePage0会把其处理成包含这个DOM的jQuery对象，BP$（，#page2’）这种形式，而$.mobile,changePage（）内部会判断to参数的形式，若是string则调用$.mobile.IoadPage（）把外部页面的元素插入到DOM中，再显示页面。(2)options(object,可选)opti

4、ons为可选参数，其值为object（对象），这个object包含多个属性，这些属性储存一个页面的各种参数jQueryMobile会根据这些参数来控制如何加载页面，以及对页面进行初始化。具体属性值如下：allowSamePa.geTransition（boolean,默认值：false）默认情况下，$.mobile.changePage（）是不会理会跳转到当前页面的请求。把这个属性设置为"true"，则可以允许这种请求changeHash（boolean,默认值：true）判断地址栏上的哈希值是否应该被更新。data（object

5、或string，默认值：undefined）Ajax请求时发送的数据。仅当to参数的值为一个URL时可用。dataUr1（string，默认值:undefined）当浏览器完成页面转换时要更新浏览器的地址栏上的URL。如不特别指定，则使用data-url的属性值。pageContainer(jQuerycollection,默认值：$.mobile,pageContainer）指定包含页面的DOM对象的jQuery对象。reloadPage（boolean,默认值:false）强制刷新页面，即使页面容器的DOM已经准备好仍然会执行

6、刷新。仅当to参数的值为一个URL时可用。reverse（boolean,默认值:false）设置页面转场动画的方向。当该属性设置为"true"时页面转场反向。role（string，默认值:undefined）显示页面的时候使用data-role值。默认情况下为undefined,即取决于元素的data-role属性值（标签上data-role的值）。showLoadMsg（boolean,默认值：true）设置当加载外部页面时是否显示加载提示信息。transition（string,默认值：$.mobile,defaultPa

7、geTransition）设置页面加载时使用的过场动画。type（string,default:"get"）设置请求页面时使用的方法（"get"或"post"）。仅当to参数的值为一个URL时可用。这里引用例子说明一下$.mobile.changePage（）的使用方法，手动调用该方法可以触发跳转到一个新页面，例如，在WebApps发生错误时可以跳转到一个提示错误的页面。//转入到"aboutus〃页面并使用〃slideup〃转场动画tion:〃slideup〃｝);//转入到〃searchresuits〃页面，使用来自id为se

8、arch的表单数据，并把页面请求方式改为"post"$.mobile.changePageCsearchresuIts.php’，｛nbsp;type:〃post〃，nbsp;data:$(〃form#search〃).serialize()｝);