jQuery mobile 监听页面的各种生命周期

一、pagebeforecreate

1.触发时机：

在页面初始化及jQuery Mobile在开始对页面进行增强之前触发。

注意： 该事件在每个页面中只能触发一次
- 在页面第一次载入时， jQuery Mobile 会在 DOM (内存)缓存页 面, 所以当你通过浏览器从第二个页面回退第一个页面时,该事件将不会被触发, 这是因为第一页面已经被初始化了。

2.监听方式:

$(document).on("pagebeforecreate","#page1",function(){
alert("pagebeforecreate : 正在创建页面！");
})

on函数第二个参数#page1指明了要监听哪个容器的该生命周期，如果重载没有这个参数的on方法，那么标示对整个页面进行监听

二、pagecreate

1.触发时机：

在页面创建成功之后，触发的事件, 但在 jQuery Mobile 完成页面增强之前。

该事件在每个页面中只能触发一次 - 在页面第一次载入时， jQuery Mobile 会在 DOM (内存)缓存页面,
所以当你通过浏览器从第二个页面回退第一个页面时,该事件将不会被触发, 这是因为第一页面已经被初始化了。

2.使用场景：

该事件通常用于用户想要对自定义组件进行增强:

$(document).on("pagecreate","#page1",function(event){
$.(":jqmData(role='my-plugin')").myPlugin();
});

3.监听方式:

$(document).on("pagecreate","#page1",function(){
alert("pagecreate : 页面创建完成！");
})

三、pagecontainerbeforeload

1.触发时机：
在当前界面跳转到另一个界面时，当另一个界面载入前触发。

2.监听方式:

$(document).on("pagecontainerbeforeload",function(){
alert("pagecontainerbeforeload : 正在加载页面！");
})

四、pagecontainerload

1.触发时机：
在当前界面跳转到另一个界面时，当另一个界面成功载入并插入到
DOM 后触发

2.监听方式:

$(document).on("pagecontainerload",function(){
alert("pagecontainerload : 页面加载完成！");
})

五、mobileinit

1.触发时机：该事件甚至会先于
jQuery 的 document.ready 事件进行加载。jQuery Mobile 实际上在文档对象本身上触发其初始化事件，第一个触发的事件是mobileinit。当Jquery Mobile开始执行时，他就会在document对象上触发mobileinit
事件，因为mobileinit事件是在加载后马上触发，所以你需要在jquery.mobile.min.js加载之前绑定你的事件处理函数

2.监听方式：

head标签中，在引入jquery.mobile.min.js文件之前，先引入自定义的js文件，在这个文件中监听mobileinit事件，否则不生效。

$(document).on("mobileinit",function(){
$.extend($.mobile,{
loadingMessage:'努力加载中...',
pageLoadErrorMessage:'找不到对应页面'
});
});

或者

$(document).on("mobileinit",function(){
$.mobile.loadingMessage = '努力加载中...';
$.mobile.pageLoadErrorMessage = '找不到对应页面';
});

3.代码说明：

使用移动设备浏览jQueryMoblie开发的网页时，如果是首次加载或加载速度较慢，则会在网页的居中位置显示滚动的加载动画和Loading的文字

信息，如果要访问的链接页面不存在，也会出现ErrorLoadingPage的提示信息，这些都属于默认配置项，都可以在document.mobileinit事件

中进行自定义设置