最近在做一个手机网站,只考虑智能手机、支持html5的浏览器。所以采用了jquery.mobile框架。
1、ajax方式加载页面
刚开始使用很不习惯,页面都默认使用ajax方式加载,这样的话,就不能在本页面写js代码了,必须等某个页面加载完毕后,在初始化这个页面的js代码。
用到了,pageload方法
$(document).live('pageload',function(e,data){ var toPage = data.dataUrl; //do somethiing });
pageload 方法中data参数中可以获取当前页面的地址,从而初始化该页面需要的js。
也可以通过,ajaxEnabled(true)默认为 true 设置页面是否需要ajax化加载页面
ajaxFormsEnabled(true) 设置表单是否需要ajax化 ps:我都是禁掉的
ajaxLinksEnabled(true) 设置链接是否需要ajax化
2、页面切换
通过在 <a href="index.html" data-transition="slideup">主站</a>设置页面之间切换的效果,
slide 滑动;slideup 卷起;slidedown 向下滑动;pop 弹出;fade 淡入/淡出; flip 翻转;
也可以通过js整体设置,很奇怪的是,我在网上查的资料都是用 $.mobile.defaultTransition = 'slide'; 就可以设置,但是我用了之后却一直没有效果,后来查到用 defaultPageTransition 就可以了,
不知道什么原因,官网上写的都是defaultTransition。