頁面跳轉：
頁面跳轉時pagebeforechange事件會被觸發兩次，通過$(document).bind("pagebeforechange", handleChangePage);來綁定pagebeforechange事件的觸發函數handleChangePage(e,data),第一次觸發時data.toPage是到達頁面的url，類型是string。第二次觸發時data.toPage是e.fn.e.init[1](搞不懂具體是什麼東西)。
第二次觸發時可以獲取到達頁面的信息，因此可以在第二次觸發時來增加自己的操作，也就是if(typeof data.toPage != “string”).這時可以用e.target.baseURI來獲取到達頁面的uri，類型是string，然後就可以分析出參數等一些東西。
利用e.target.find(“pageId”)來獲取到達頁的相應元素加以控制。
“get”方式提交時可以直接解析e.target.baseURI來獲取參數
“post”方式提交時可以分析data.options.data來獲取參數。也可以在changePage裏利用$(“form”).serializeArray()轉換爲JSON對象（這種方式比較好）或者$(“form”).serialize()轉換成字符串。
如果發生中文亂碼問題，可以嘗試使用decodeURIComponent(str)進行解碼。
代碼實例：
index.html
<!DOCTYPE html>
<html class="ui-mobile">
<head>
<title>Page Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<META HTTP-EQUIV="pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Cache-Control" CONTENT="no-store, must-revalidate">
<META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">
<META HTTP-EQUIV="expires" CONTENT="0">
<meta charset="utf-8">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.js"></script>
<script type="text/javascript" charset="utf-8">
$( document ).delegate("#index", "pageinit", function() {
$(document).bind( "pagebeforechange", beforechange);
});
function beforechange( e, data ) {
if ( typeof data.toPage != "string" ) {
var url = $.mobile.path.parseUrl(e.target.baseURI),
re = /a.html/;
if(url.href.search(re) != -1){
var page = $(e.target).find("#a2");
var d = data.options.data;
page.find("#s").append(decodeURIComponent(d));
}
}
}
</script>
</head>
<body>
<div data-role="page" id="index">
<div data-role="header">.header.</div>
<div data-role="content">
<a href="dir1/a.html?p1=112&p2=113">a.html</a><br>
<div id="ccc"><a href="#c" id="cc">cccccc</a><br></div>
<a href="dir2/b.html" data-rel="dialog" data-transition="pop">Open dialog</a>
<form action="a.html" method="post">
姓名：<input type="text" value="23" name="name"/><br>
密碼：<input type="text" value="過後" name="pwd"/><br>
<input type="submit" value="submit"/>
</form>
</div>
<div data-role="footer" data-position="fixed">footer</div>
</div>
</body></html>
a.html
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<META HTTP-EQUIV="pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Cache-Control" CONTENT="no-store, must-revalidate">
<META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">
<META HTTP-EQUIV="expires" CONTENT="0">
<meta charset="utf-8">
<link rel="stylesheet"
href="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.js"></script>
</head>
<body>
<div data-role="page" id="a2" >
<div data-role="header">
.header.
</div>
<div data-role="content">
<a href="../dir2/b.html" >b.html</a>
<br>
<a data-rel="back" href="b.html">back</a>
<div id="s"></div>
</div>
<div data-role="footer" data-position="fixed">
footer
</div>
</div>
</body>
</html>
Jquerymobile加載頁面相關知識：
如果採用ajax的方式鏈接到一個有多page的文檔doc1，那麼只會加載第一個page，這時就無法在這個page上鍊接到文檔doc1上的其他page了。利用subpage插件可以實現多page文檔的加載。
使用ajax方式來跳轉到下一個文檔時，由於jquerymobile框架的限制不會加載<div data-role=”page”></div>外面的js和css資源，所以把應當把js和css代碼放到<divdata-role=”page”></div>裏面。
Jquerymobile中推薦在捕獲pageinit事件的函數中來操作page裏的元素。例：
$( document).delegate("#aboutPage", "pageinit", function() {
alert('Apage with an ID of "aboutPage" was just created by jQuery Mobile!');
});
預加載頁面
1、<ahref="prefetchThisPage.html"data-prefetch> ... </a>
2、$.mobile.loadPage(pageUrl, { showLoadMsg: false } );
使用單一頁面模式時，通過以上兩種方式Jquerymobile會在主界面加載後在後臺加載預加載的文件，同時會觸發pagecreate事件。
這樣能夠流暢地轉移到預加載的頁面而不會顯示加載的信息
緩存頁面
保留所有訪問過的頁面
$.mobile.page.prototype.options.domCache = true;緩存特定的頁面
<div data-role="page" id="cacheMe" data-dom-cache="true">pageContainerElement.page({ domCache: true });
Hash和Ajax頁面驅動模型：
通過Ajax形式來跳轉頁面時，會觸發hashchange 事件，jquerymobile在處理這個事件時會修改location.href的值。
Jquerymobile是通過給頁面添加 "ui-page-active" 樣式來設置顯示的頁面的。
pushState 插件：
jquerymobile利用 history.replaceState函數將基於hash的長的url轉換爲更加簡潔的完整的文檔地址。如果瀏覽器不支持 history.replaceState，或者禁用了這一特性，地址欄就會顯示基於hash的url（就是帶#的url）。
Jquerymobile這時會觸發hashchange事件，可以通過$(window).bind("hashchange",function（e）{});來進行捕獲
可以在文檔完全加載前通過設置$.mobile.pushStateEnabled=false來禁用這一特性。
如果不支持ajax的導航模式，或者設置了 rel="external" 或$.mobile.ajaxEnabled=false，則建議禁用這一特性以獲得更加連貫的行爲。
小知識：
一、Jquery頁面加載函數寫法：
1）
$(document).ready(function(){
...
})
2)
$(function(){
...
})
二、jquerymobile中這種寫法
(function(window, undefined ) {
...// code goes here
})(window)
前一個括號是聲明一個函數，後面的括號是調用這個函數並傳參。
函數帶undefined參數的目的是防止在外部聲明瞭undefined變量導致錯誤的引用。
三、使用ajax和window.history.pushState無刷新改變頁面內容和地址欄URL
history.pushState():改變當前頁面的URL，將URL放入瀏覽器歷史裏
history.replaceStat():將指定的URL替換當前的URL
如何調用
var state = {
title: title,
url: options.url,
otherkey: othervalue
};
window.history.pushState(state,document.title, url);
如何響應瀏覽器的前進、後退操作
window對象上提供了onpopstate事件，上面傳遞的state對象會成爲event的子對象，這樣就可以拿到存儲的title和URL了。
window.addEventListener('popstate',function(e){
if (history.state){
var state = e.state;
//do something(state.url, state.title);
}
}, false);
這樣就可以結合ajax和pushState完美的進行無刷新瀏覽了。