一、页面初始化事件(Page initiallization) 在页面创建前，当页面创建时，以及在页面初始化之后。只在第一次加载时执行。
1. pagebeforecreate 页面创建前
[sourcecode language="plain"]
$(document).on("pagebeforecreate", function(){
console.log("执行pagebeforecreate");
});
[/sourcecode]
2. pagecreate页面创建时
[sourcecode language="plain"]
$(document).on("pagecreate",
function(){
console.log("执行pagecreate");
});
[/sourcecode]
3. pageinit 页面初始化之后
[sourcecode language="plain"]
$(document).on("pageinit",
function(){
console.log("执行pageinit");
});
[/sourcecode]
二、页面加载事件(Page Load/Unload) 当外部页面加载时、卸载时或加载失败时
- pagebeforeload
[sourcecode language="plain"]
$(document).on("pagebeforeload", function(event,
data){
console.log("执行pagebeforeload" +
data.url);
});
[/sourcecode]
2. pageload
[sourcecode language="plain"]
$(document).on("pageload", function(event, data){
console.log("执行pageload"
+ data.url);
});
[/sourcecode]
三、页面过渡事件(Page Transition) 在页面过渡之前和之后，每次过渡时都会触发。
- pagebeforeshow
[sourcecode language="plain"]
$(document).on("pagebeforeshow", "#index2",
function(){
console.log("index-pagebeforeshow");
});
[/sourcecode]
2. pageshow(常用)
[sourcecode language="plain"]
$(document).on("pageshow", "#index2",
function(){
console.log("index-pageshow");
});
[/sourcecode]
3. pagebeforehide
[sourcecode language="plain"]
$(document).on("pagebeforehide", "#index",
function(){
console.log("index-pagebeforehide");
});
[/sourcecode]
4. pagehide
[sourcecode language="plain"]
$(document).on("pagehide", "#index",
function(){
console.log("index-pagehide");
});
[/sourcecode]
页面index过渡到index2，执行顺序为：
a. 页面index的 pagebeforehide
b. 页面index2的pagebeforeshow
c. 页面index的 pagehide
d. 页面index2的 pageshow
注意：pageinit和pageshow的区别， pageinit初始化一次，pageshow每次进入页面都会执行。
查看原文：http://www.haojianhua.com/2015/09/23/jquery-mobile-页面事件总结/