1、预加载与页面缓存

(1)预加载

         在新建的HTML页面中添加一个<a>元素,将该元素的href属性设置为about.html,并将data-prefetch属性设置为true,表示预加载a元素的链接页面。

         调用javascript中的全局性方法$mobile.loadPage()来预加载指定的目标HTML页面,其效果与设置元素的data-prefench属性是一致的


(2)页面缓存

         将HTML页面中page容器的data-dom-cache属性设置为true,可以将该页面的内容注入到文档的缓存中

         调用javascript中的全局性方法$mobile.page.prototype.options.domCache=true,效果和设置page容器的data-dom-Cache是一样的。


2、页面的脚本

         页面在初始化时,会触发pagecreate事件,在该事件中可以做一些页面的初始化工作;如果需要通过javascript来改变当前的工作页面,可以调用jquery mobile中提供的changePage()页面(这个方法可以设置跳转页面的URL地址,跳转时的动画效果和所携带的数据),还可以调用loadPage()方法来加载指定的外部页面,注入当前文档中。

         例如使用changePage()进行跳转页面的操作如下:


<script  type = "text/javacript">

$(function(){

$mobile.changePage("about.html",{transition:"slideup"})

})

</script>


         还可以传递数据如下:


<script  type="text/javascript">

$mobile.changePage("login.jsp",

{

type:"post",

data:$("form#login").serialize()

},

"pop",false,false

)

</script>



         上述代码表示:将“id”号为login的表单数据进行序列化后,传递给“login.jsp”页面进行处理,"pop"表示页面跳转的效果,第一个false表示跳转时的方向,如果为true则表示反方向跳转,默认为false;第二个false表示完成后是否更新浏览记录,默认值为true,表示更新。

3、事件

         在javascript中,可以用live()方法绑定元素出发的事件,还可以使用bind()和delegate()为绑定的元素添加指定的事件