JqueryMobile的初始化事件,在document.ready事件之前被加载,名字叫做mobileinit
Mobileinit事件绑定
$(document).bind(“mobileinit”,function (){
//全局代码
});
$.mobile对象为设置所有属性的入口点
JqueryMobile的页面和对话框的效果都是通过Ajax来实现,可以在mobileinit事件里面改写这些效果
$(document).bind(“mobileinit”,function (){
$.mobile.defaultPageTransition = “slide”;
$.mobile.defaultDialogTransition = “slide”;
});
JqueryMobile提供了6种效果供用户选择,分别是slide(滑动),slideup,slidedown,pop,fade(渐变),flip(翻转)
设置全局加载及措施提示信息,也是在mobileinit事件里完成,$.mobile.loadingMessage,$.mobile.pageLoadErrorMessage
JqueryMobile的Touch事件,Touch事件包括tap(当用户点屏幕时触发),taphold(当用户点屏幕且保持触摸超过1秒时触发),swipe(当页面被水平或垂直拖动时触发),
swipeleft,swiperight分别表示页面被拖动到左边和右边时触发
$(document).ready(function (){
$(“body”).bind(‘tap, function (event){
});
});
JqueryMobile的方向感应事件(横屏竖屏的切换)
$(document).ready(function (){
$(“body”).bind(‘orientationchange’, function (event){
});
});
有可能DOM加载时orientationchange事件还没能完全加载完毕,所以在ready后还应该再加载一次,保险的代码如下:
$(document).ready(function (){
$(“body”).bind(“orientationchange”, function (event){
//event.orientation表示屏幕方向
});
$(“body”).trigger(“orientationchange”);
});
JqueryMobile的滚动事件
$(document).ready(function (){
$(“body”).bind(“scrollstart”, function (event){
});
$(“body”).bind(“scrollstop”, function (event){
});
});
JqueryMobile的页面跳转,第一个参数目标页面,第二个参数切换效果(transition过度,reverse翻转,changeHash,role,pageContainer,type,data,reloadPage)
$.mobile.changePage(“a.html”,”slideup”);
//将id为search的form表单以POST的方式提交到a.jsp页面
$.mobile.changePage({
url:”a.jsp”,
type:”POST”,
data:$(“form#search”).serialize()
});
$.mobile.loadPage(“a.html”);相当于是iframe
· $.mobile.path.parseUrl 将一个URL进行解析成带有16个属性的对象
· $.mobile.path.makePathAbsolute 将文件或目录转变为带绝对路径的形式
· $.mobile.path.makeUrlAbsolute 将一个相对路径转变为一个绝对路径
· $.mobile.path.isSameDomain 对比两个URL是否相同
· $.mobile.path.isRelativeUrl 判断地址是否相对地址
· $.mobile.path.isAbsoluteUrl 判断地址是否绝对地址
· $.mobile.path.base 得出URL地址的base部分JqueryMobile基础教程