jQuery Mobile是針對移動端開發(fā)的JavaScript框架,正如其名基于jQuery庫,jQuery Mobile主要被用來操作HTML5設計頁面UI,下面就來看一下jQuery Mobile操作HTML5的常用函數(shù)總結(jié):

一. $.mobile.changePage() & $.mobile.loadPage()

1.$.mobile.changePage()

$.mobile.changePage() 方法會在頁面加載時自動調(diào)用，若這個頁面為當前文檔中的不同 "page"，則會轉(zhuǎn)到這個新頁面隱藏舊頁面；若這個頁面為外部頁面，即頁面與當前頁面不在同一文檔中（本質(zhì)上是新頁面不在當前 DOM 中），$.mobile.changePage() 首先會調(diào)用 $.mobile.loadPage() 把外部頁面的元素插入到 DOM 中，再顯示新頁面。這也是對頁面加載過程的簡單復述。

$.mobile.changePage() 有兩個參數(shù) to (string or object, 必須) 和 options (object, 可選)，具體如下：

（1）—— to (string or object, 必須)

to 為必要參數(shù)，其值可以為 string(字符串，如 "about/us.html") 或 object(對象，如 $("#about"))，這主要是面向兩種不同的頁面，string 形式的為外部頁面鏈接，而 object 為同一文檔中的不同 "page" ，如 "#page2" ，$.mobile.changePage() 會把其處理成包含這個 DOM 的 jQuery 對象，即 $('#page2') 這種形式，而 $.mobile.changePage() 內(nèi)部會判斷 to 參數(shù)的形式，若是 string 則調(diào)用 $.mobile.loadPage() 把外部頁面的元素插入到 DOM 中，再顯示頁面。

（2）—— options (object, 可選)

options 為可選參數(shù)，其值為 object （對象），這個 object 包含多個屬性，這些屬性儲存一個頁面的各種參數(shù)，jQuery Mobile 會根據(jù)這些參數(shù)來控制如何加載頁面，以及對頁面進行初始化。具體屬性值如下：

allowSamePageTransition (boolean, 默認值: false) 默認情況下，$.mobile.changePage() 是不會理會跳轉(zhuǎn)到當前頁面的請求。把這個屬性設置為 "true" ，則可以允許這種請求

changeHash (boolean, 默認值: true) 判斷地址欄上的哈希值是否應該被更新。

data (object 或 string, 默認值: undefined) Ajax 請求時發(fā)送的數(shù)據(jù)。僅當 to 參數(shù)的值為一個 URL 時可用。

dataUrl (string, 默認值: undefined) 當瀏覽器完成頁面轉(zhuǎn)換時要更新瀏覽器的地址欄上的 URL 。如不特別指定，則使用 data-url 的屬性值。

pageContainer (jQuery collection, 默認值: $.mobile.pageContainer) 指定包含頁面的 DOM 對象的 jQuery 對象。

reloadPage (boolean, 默認值: false) 強制刷新頁面，即使頁面容器的 DOM 已經(jīng)準備好仍然會執(zhí)行刷新。僅當 to 參數(shù)的值為一個 URL 時可用。

reverse (boolean, 默認值: false) 設置頁面轉(zhuǎn)場動畫的方向。當該屬性設置為 "true" 時頁面轉(zhuǎn)場反向。

role (string, 默認值: undefined) 顯示頁面的時候使用 data-role 值。默認情況下為 undefined，即取決于元素的 @data-role 屬性值（標簽上 data-role 的值）。

showLoadMsg (boolean, 默認值: true) 設置當加載外部頁面時是否顯示加載提示信息。

transition (string, 默認值: $.mobile.defaultPageTransition) 設置頁面加載時使用的過場動畫。

type (string, default: "get") 設置請求頁面時使用的方法 ("get" 或 "post") 。僅當 to 參數(shù)的值為一個 URL 時可用。

這里引用例子說明一下 $.mobile.changePage() 的使用方法，手動調(diào)用該方法可以觸發(fā)跳轉(zhuǎn)到一個新頁面，例如，在 Web Apps 發(fā)生錯誤時可以跳轉(zhuǎn)到一個提示錯誤的頁面。

// 轉(zhuǎn)入到 "about us" 頁面并使用 "slideup" 轉(zhuǎn)場動畫

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

// 轉(zhuǎn)入到 "search results" 頁面, 使用 來自 id 為 search 的表單數(shù)據(jù)，并把頁面請求方式改為 "post"

$.mobile.changePage('searchresults.php', {

  type: "post",

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

});

// 轉(zhuǎn)入到 "confirm" 頁面并使用 "pop" 轉(zhuǎn)場動畫，不更新歷史記錄（地址欄哈希值不更新）

$.mobile.changePage('../alerts/confirm.html', {

  transition: "pop",

  reverse: false,

  changeHash: false

});

發(fā)生錯誤時可以跳轉(zhuǎn)到一個提示錯誤的頁面。

$(function(){

  // 發(fā)生錯誤

  // 已 "slideup" 的方式彈出對話框提示發(fā)生了錯誤

  $.mobile.changePage('../alerts/confirm.html', {

    transition: "slideup",

    role: "dialog"

  });

});

2.$.mobile.loadPage()

如上面所述，$.mobile.loadPage() 用于加載一個外部頁面，但這里的加載是指把外部頁面的元素插入到當前 DOM 中，并在插入之前對頁面內(nèi)容進行 jQuery Mobile 增強 。該方法會被 $.mobile.changePage() 調(diào)用，條件是 $.mobile.loadPage() 的第一個參數(shù) to 為 string （即加載的頁面為外部頁面）。這個方法僅僅是進行插入 DOM 操作，不會影響當前激活的頁面，所以它可以用于在后臺加載頁面（只插入 DOM 而不顯示頁面），該方法會返回一個 deferred 對象，包含頁面請求成功與否等相關(guān)信息，并會在頁面增強和插入 DOM 后分解這個對象。

$.mobile.loadPage() 有兩個參數(shù) url (string or object, 必須) 和 options (object, 可選)，具體情況如下：

（1）—— url (string or object, 必須)

該參數(shù)的值可以為 string 或 object ，無論是何種形式，必須為一個絕對或相對 URL 。若是由 $.mobile.changePage() 調(diào)用本方法時，則該參數(shù)值為 $.mobile.changePage() 的 to 參數(shù)值。

（2）—— options (object, 可選)

options 為可選參數(shù)，其值為 object （對象），實際上如由 $.mobile.changePage() 調(diào)用本方法時，該參數(shù)值為 $.mobile.changePage() 的 options 參數(shù)值。因此這個 object 與 $.mobile.changePage() 的 options 選項值相同，其具體屬性值請參考 $.mobile.changePage() 中 options 的屬性值。

這里引用例子說明一下 $.mobile.loadPage() 的使用方法，手動調(diào)用該方法可以在后臺加載外部頁面的元素并且不影響當前激活頁面。

// 把 "about us" 頁面加載到 DOM

$.mobile.loadPage('about/us.html');

// 轉(zhuǎn)入到 "search results" 頁面, 使用來自 id 為 search 的表單數(shù)據(jù)，并把頁面請求方式改為 "post"

$.mobile.loadPage('searchresults.php', {

  type: "post",

  data: $('form#search').serialize()

});

二. $.fn.jqmData() & $.fn.jqmRemoveData()

當頁面中使用了 jQuery Mobile ，jQuery Mobile 會使用 jqmData 和 jqmRemoveData 代替 jQuery 核心的 data 和 removeData 方法（注意，這包括了 jQuery 中的 $.fn.data , $.fn.removeData , $.data , $.removeData 和 $.hasData），這兩個方法會自動獲取和設置 data 屬性的命名空間（即使當前沒有使用命名空間）。

這兩個方法的參數(shù)對應著 jQuery 的 data 和 removeData 方法的參數(shù)，具體如下：

（1）—— jqmData( jQuery.data() )

element 與該 data 屬性相關(guān)聯(lián)的 DOM 對象

key data 的命名字符串

value data 屬性的值

（2）—— jqmRemoveData ( jQuery.removeData() )

element 與需要移除 data 屬性相關(guān)聯(lián)的 DOM 對象

name 需要移除的 data 的命名字符串

注意：當通過 jQuery Mobile data 屬性尋找元素時，請使用自定義選擇器：jqmData() ，它會在查詢元素時自動合并 data 屬性的命名空間。例如，你應該使用 $('div:jqmData(role="page")') 代替 $('div[data-role="page"]') ，因為前者會自動映射到 $("div[data-"+ $.mobile.ns +'role="page"]') ，而不需要強制把選擇器與命名空間連接起來。例如：命名空間為 rn ，若使用后者即為 $('div[data-rn-role="page"]') ，這時如果更改了命名空間，則這個選擇器便會失效，而使用前者則會自動映射到當前選擇器中，即使更改命名空間也不會造成這個選擇器失效。

但是也有例外的情況，就是根據(jù) URL 值在命名空間中選擇 data 屬性，例如，jQuery Mobile 可以使用 :jqmData(url) 跟蹤一個頁面來自哪里，根據(jù) URL 中的命名空間來選擇空間內(nèi)的 data 屬性。這要求需要在選擇器的括號內(nèi)填寫一個有效的 URL 。

三. $.fn.jqmEnhanceable()

這是判斷元素是否要進行 jQuery Mobile 增強的方法，默認情況下，所有 jQuery Mobile 組件都會通過此方法放入 jQuery Mobile 增強集，以交給另一函數(shù)進行 jQuery Mobile 增強，包括添加相應的 HTML , CSS class 和交互。這是 jQuery Mobile 默認調(diào)用的方法，并且沒有任何可選參數(shù)，但該方法仍有一個很值得注意的地方，在方法的實現(xiàn)函數(shù)內(nèi)部，會判斷默認配置 $.mobile.ignoreContentEnabled 的值，若為 true ，則會對調(diào)用該方法的 jQuery 對象的 DOM 父節(jié)點遍歷，若父節(jié)點標簽上設置了 data-enhance = "false" ，則不讓該 DOM 對象加入增強集。事實上 jQuery Mobile 的官方文檔并沒有闡述 $.fn.jqmEnhanceable() 的具體使用方法，反而用了不少篇幅介紹這個注意事項。

另外還需要注意的是，遍歷操作會設計元素的所有父節(jié)點，因此即使遍歷一個很小的 jQuery 對象集的父節(jié)點也會消耗很多資源，開發(fā)則需要謹慎使用。若開發(fā)時已經(jīng)明確不需要對某元素進行增強，建議還是直接不使用 data-role 觸發(fā)相應的組件。

而如何設置 $.mobile.ignoreContentEnabled 的值，可以參考《使用 jQuery Mobile 與 HTML5 開發(fā) Web App —— jQuery Mobile 默認配置與事件基礎》

四. $.fn.jqmHijackable()

這是判斷元素是否加入 jQuery Mobile Ajax 導航，即使用 Ajax 進行處理的方法，與 $.fn.jqmEnhanceable() 相似，默認情況下這也是會為所有鏈接和表單提交執(zhí)行，使到它們可以加入 jQuery Mobile Ajax 處理集合，交給另一函數(shù)處理。在 jQuery Mobile 內(nèi)部，本方法與 $.fn.jqmEnhanceable() 最終都是調(diào)用了 haveParents 方法，來判斷元素是否應該加入相應的集合。因此，本方法執(zhí)行時會判斷默認配置 $.mobile.ignoreContentEnabled ，若為 true ，則會對調(diào)用該方法的 jQuery 對象的 DOM 父節(jié)點遍歷，若父節(jié)點上標簽上設置了 data-ajax = "false" ，則不讓該 DOM 對象加入 Ajax 導航集。當然，在使用這個特性時也需要注意遍歷帶來的大量資源消耗。

五. $.mobile.loading()

該方法從 jQuery Mobile 1.2 開始正式引進，控制顯示或隱藏頁面加載信息，包含兩個參數(shù)，第一個是控制頁面信息加載與否，只有 "show" 和 "hide" 兩個值，第二個參數(shù)為多屬性對象，具體的屬性如下：

theme (string, 默認值: "a") 加載信息條的主題樣式

text (string, 默認值: "loading") 加載信息條的文字內(nèi)容

textonly (boolean, 默認值: false) 若設置為 true ，則加載頁面時 "spinner" 圖片（即旋形加載提示圖，1.0 及之前版本為條形加載圖）會被隱藏。

textVisible (boolean, 默認值: false) 若設置為 true ,提示的文字內(nèi)容會置于 spinner 之下

html (string, 默認值: "") 如果個屬性值不為空，則這個值會替代整個加載信息條的 HTML

下面引用例子說明 $.mobile.loading 的使用方法。

// 提示頁面正在加載

$.mobile.loading('show');

// 加載信息條使用主題樣式 "b" , 自定義提示文字內(nèi)容，隱藏 "spinner" 圖片

$.mobile.loading('show', { theme: 'b', text: '給力的加載中', textonly: true });

以下兩個方法在 jQuery Mobile 1.2 中不贊成使用

六. $.mobile.hidePageLoadingMsg()

顯示頁面加載信息，基于 $.mobile.loadingMessage 配置出來，具體有三個參數(shù)

theme (string, default: "a") The theme swatch for the message.

msgText (string, default: "loading") The text of the message.

textonly (boolean, default: false) If true, the "spinner" image will be hidden when the message is shown.

例子：

// 使用主題樣式 "b" ，自定義提示文字內(nèi)容，隱藏 "spinner" 圖片

$.mobile.showPageLoadingMsg('b', 'This is only a test', true);

在 jQuery Mobile 1.2 中，建議使用 $.mobile.loading('show') 代替。

七. $.mobile.hidePageLoadingMsg()

隱藏頁面加載信息，基于 $.mobile.loadingMessage 配置出來，沒有參數(shù)。

例子：

// 隱藏頁面加載提示信息

$.mobile.hidePageLoadingMsg();

在 jQuery Mobile 1.2 中，建議使用 $.mobile.loading('hide') 代替。

八. $.mobile.fixedToolbars.show()

固定工具欄（包括固定的頭部欄和尾部欄）可以通過點擊屏幕在顯示與隱藏之間切換，而這個方法則是手動顯示一次工具欄。

它具有一個參數(shù) immediately(boolean, 可選) 。把它設置為 true ，當前激活頁面的所有固定工具欄都會立即顯示出來。若設置為 false 或者沒有指定，則會通過 100ms 的漸變顯示出來。注意如 document 的 resize 和 scroll 等事件會導致額外的延時顯示。

例子：

// 顯示固定工具欄并且顯示默認的漸變動畫

$.mobile.fixedToolbars.show();

// 立即顯示固定工具欄

$.mobile.fixedToolbars.show(true);

在 jQuery Mobile 1.1 中，不建議使用該方法，jQuery Mobile 并沒有明確原因，但根據(jù) jQuery Mobile 的習慣，這很可能是因為這個方法有很多不穩(wěn)定性，如上面提到的遇到某些方法會出現(xiàn)額外的延時顯示，這對于建立 Web Apps 是很不好的影響因素，它會從底層部分為 Web Apps 帶來不可預知的問題。

九. $.mobile.fixedToolbars.hide()

固定工具欄（包括固定的頭部欄和尾部欄）可以通過點擊屏幕在顯示與隱藏之間切換，而這個方法則是手動隱藏一次工具欄。

與 $.mobile.fixedToolbars.show() 相似，它具有一個參數(shù) immediately(boolean, 可選) 。把它設置為 true ，當前激活頁面的所有固定的工具欄都會立即隱藏。若設置為 false 或者沒有指定，則會通過 100ms 的漸變隱藏起來。注意如 document 的 resize 和 scroll 等事件也會增加隱藏動畫的時間。

例子：

// 隱藏固定工具欄并顯示默認的漸變動畫

$.mobile.fixedToolbars.hide();

// 立即隱藏固定工具欄

$.mobile.fixedToolbars.hide(true);

在 jQuery Mobile 1.1 中，也不建議使用該方法。

十. $.mobile.path.parseUrl()

本方法用于解析一個 URL 和它的相對形式，并且它的相關(guān)成分放入一個對象中，方便訪問這些 URL 相關(guān)成分。當解析相對形式的 URL 時，返回的對象會自動為絕對形式 URL 中沒有的成分（如 protocol, host , etc ）添加空字符串作為值。另外，當解析的 URL 沒有 authority （見下面的列表），返回的對象中的 pathname 屬性會包含通信協(xié)議冒號后的數(shù)據(jù)。

$.mobile.path.parseUrl() 只有一個參數(shù) URL (string, 可選) ，其值為一個 URL 的相對或絕對形式。

另外，$.mobile.path.parseUrl() 會返回一個包含 URL 相關(guān)成分的對象，這個對象的屬性是模仿瀏覽器中的 location 對象。具體的屬性如下：

hash URL 中的一個部分，從 URL 中第一個 "#" 開始的部分。

host URL 的主機名及端口。

hostname URL 的主機名。

href 被解析的原始 URL 。

pathname URL 所引用的文件或目錄的路徑。

port URL 中指定的端口。大多數(shù) URLs 依賴于數(shù)據(jù)傳輸協(xié)議所用的默認端口，所以這個值在大多數(shù)時候都可能是空字符串。

protocol 數(shù)據(jù)傳輸協(xié)議，URL 中 ':' 之前的部分。

search URL 中的從 "?" 字符開始的部分，代表 URL 查詢。另外它也包括提供給入口的額外成分，如一些常見形式的開發(fā)者訪問。

authority URL 的用戶名，密碼，主機名

directory pathname 中的目錄部分，并且不包括任何文件名。

domain URL 中的數(shù)據(jù)傳輸協(xié)議和用戶名，密碼，主機名等信息，即域。

filename pathname 中的文件部分，并且不包括任何目錄名。

hrefNoHash 從原始 URL 中減去 hash 部分。

hrefNoSearch 從原始 URL 中減去 hash 和 search 部分。

password authority 中的 password 部分。

username authority 中的 username 部分。

例子：

// 解析一個 URL

var obj = $.mobile.path.parseUrl("http://jblas:password@mycompany.com:8080/mail/inbox?msg=1234");

// 解析這個 URL 會返回一個包含以下屬性的對象

// obj.href:     http://jblas:password@mycompany.com:8080/mail/inbox?msg=1234&type=unread#msg-content

// obj.hrefNoHash:  http://jblas:password@mycompany.com:8080/mail/inbox?msg=1234&type=unread

// obj.hrefNoSearch: http://jblas:password@mycompany.com:8080/mail/inbox

// obj.domain:    http://jblas:password@mycompany.com:8080

// obj.protocol:   http:

// obj.authority:  jblas:password@mycompany.com:8080

// obj.username:   jblas

// obj.password:   password

// obj.host:     mycompany.com:8080

// obj.hostname:   mycompany.com

// obj.port:     8080

// obj.pathname:   /mail/inbox

// obj.directory:  /mail/

// obj.filename:   inbox

// obj.search:    ?msg=1234&type=unread

// obj.hash:     #msg-content

十一. $.mobile.path.makePathAbsolute()

把一個相對的文件或目錄路徑轉(zhuǎn)化為絕對路徑。

具有兩個參數(shù) relPath (string, 必須) 和 absPath (string, 必須) ，具體如下：

（1）—— relPath (string, 必須)

其值為一個相對的文件或目錄路徑。

（2）—— absPath (string, 必須)

用于解析的一個絕對的文件或相對的路徑。

$.mobile.path.makePathAbsolute() 會返回一個包含相對路徑的絕對路徑版本的字符串。

例子：

// 返回: /a/b/c/file.html

var absPath = $.mobile.path.makePathAbsolute("file.html", "/a/b/c/bar.html");

// 返回: /a/foo/file.html

var absPath = $.mobile.path.makePathAbsolute("../../foo/file.html", "/a/b/c/bar.html");

十二. $.mobile.path.makeUrlAbsolute()

把一個相對 URL 轉(zhuǎn)化為絕對 URL 。

具有兩個參數(shù) relUrl (string, 必選) 和 absUrl (string, 必選) ，具體如下：

—— relUrl (string, 必選)

一個相對形式的 URL 。

—— absUrl (string, 必選)

用于解析的一個絕對的文件或相對的路徑。

$.mobile.path.makeUrlAbsolute() 會返回一個包含相對 URL 的絕對 URL 版本的字符串。

例子：

// 返回: http://foo.com/a/b/c/file.html

var absUrl = $.mobile.path.makeUrlAbsolute("file.html", "http://foo.com/a/b/c/test.html");

// 返回: http://foo.com/a/foo/file.html

var absUrl = $.mobile.path.makeUrlAbsolute("../../foo/file.html", "http://foo.com/a/b/c/test.html");

// 返回: http://foo.com/bar/file.html

var absUrl = $.mobile.path.makeUrlAbsolute("http://foo.com/bar/file.html", "http://foo.com/a/b/c/test.html");

// 返回: http://foo.com/a/b/c/test.html?a=1&b=2

var absUrl = $.mobile.path.makeUrlAbsolute("?a=1&b=2", "http://foo.com/a/b/c/test.html");

// 返回: http://foo.com/a/b/c/test.html#bar

var absUrl = $.mobile.path.makeUrlAbsolute("#bar", "http://foo.com/a/b/c/test.html");

十三. $.mobile.path.isSameDomain()

比較兩個 URL 的域。

具有兩個參數(shù) url1 (string, 可選) 和 url2 (string, 可選) 具體情況如下：

—— url1 (string, 可選)

一個相對 URL。

—— url2 (string, 可選)

url2 (string, required) 一個需要解析的絕對 URL 。

返回值為 boolean 型變量，若兩個域匹配，則返回 "true" ，否則返回 "false" 。

例子：

// 返回: true

var same = $.mobile.path.isSameDomain("http://foo.com/a/file.html", "http://foo.com/a/b/c/test.html");

// 返回: false

var same = $.mobile.path.isSameDomain("file://foo.com/a/file.html", "http://foo.com/a/b/c/test.html");

// 返回: false

var same = $.mobile.path.isSameDomain("https://foo.com/a/file.html", "http://foo.com/a/b/c/test.html");

// 返回: false

var same = $.mobile.path.isSameDomain("http://foo.com/a/file.html", "http://bar.com/a/b/c/test.html");

十四. $.mobile.path.isRelativeUrl()

判斷一個 URL 是否是相對 URL 。

它具有一個參數(shù) URL (string, 必選) ，其值為一個相對或絕對的 URL 。

返回值為 boolean 型變量，若 URL 為相對形式的 URL ，則返回 "true" ，否則返回 "false" 。

例子：

// 返回: false

var isRel = $.mobile.path.isRelativeUrl("http://foo.com/a/file.html");

// 返回: true

var isRel = $.mobile.path.isRelativeUrl("http://foo.com/a/file.html");

// 返回: true

var isRel = $.mobile.path.isRelativeUrl("/a/file.html");

// 返回: true

var isRel = $.mobile.path.isRelativeUrl("file.html");

// 返回: true

var isRel = $.mobile.path.isRelativeUrl("?a=1&b=2");

// 返回: true

var isRel = $.mobile.path.isRelativeUrl("#foo");

十五. $.mobile.path.isAbsoluteUrl()

判斷一個 URL 是否是絕對 URL 。

它具有一個參數(shù) URL (string, 必選) ，其值為一個相對或絕對的 URL 。

返回值為 boolean 型變量，若 URL 為絕對形式的 URL ，則返回 "true" ，否則返回 "false" 。

例子：

// 返回: true

var isAbs = $.mobile.path.isAbsoluteUrl("http://foo.com/a/file.html");

// 返回: false

var isAbs = $.mobile.path.isAbsoluteUrl("http://foo.com/a/file.html");

// 返回: false

var isAbs = $.mobile.path.isAbsoluteUrl("/a/file.html");

// 返回: false

var isAbs = $.mobile.path.isAbsoluteUrl("file.html");

// 返回: false

var isAbs = $.mobile.path.isAbsoluteUrl("?a=1&b=2");

// 返回: false

var isAbs = $.mobile.path.isAbsoluteUrl("#foo");

十六. $.mobile.path.get()

該方法可以判斷一個 URL 的目錄部分。如果 URL 末尾沒有反斜杠，則 URL 最后的部分會被認為是文件名。這個情況對于站長來說應該不陌生，如 http://kayosite.com/aaa/ ，URL 中最后的部分 "aaa/" 應該是一個目錄，而 http://kayosite.com/aaa/xxx.zip 中最后的部分 "xxx.zip" 則應該是一個文件名。這也是 Kayo 之前建議注意網(wǎng)址末尾是否需要添加反斜杠的原因。

這個方法具有一個參數(shù) url (string, 必選) ，其值是一個相對或絕對的 URL 。

返回值為 URL 中的目錄部分。

例子：

// 返回: http://foo.com/a/

var dirName = $.mobile.path.get("http://foo.com/a/file.html");

// 返回: http://foo.com/a/

var dirName = $.mobile.path.get("http://foo.com/a/");

// 返回: http://foo.com/a

var dirName = $.mobile.path.get("http://foo.com/a");

// 返回: //foo.com/a/

var dirName = $.mobile.path.get("http://foo.com/a/file.html");

// 返回: /a/

var dirName = $.mobile.path.get("/a/file.html");

// 返回: ""

var dirName = $.mobile.path.get("file.html");

// 返回: /

var dirName = $.mobile.path.get("/file.html");

// 返回: ?a=1&b=2

var dirName = $.mobile.path.get("?a=1&b=2");

// 返回: foo

var dirName = $.mobile.path.isAbsoluteUrl("#foo");

十七. $.mobile.base

獲取根元素。

十八. $.mobile.silentScroll()

靜默滾動到某個 Y 值處，并且不觸發(fā)任何事件。

它具有一個參數(shù)，yPos (number, 默認為 0)，其值為需要滾動到的 Y 位置。

十九. $.mobile.activePage

引用當前激活的頁面。

二十. 關(guān)于方法的調(diào)用

1. 方法調(diào)用相應 JavaScript 的引入

在介紹自定義 jQuery Mobile 默認配置時，曾經(jīng)說明了相應的 JavaScript 語句需要放置在 jQuery 庫和 jQuery Mobile 庫之間，而 jQuery Mobile 方法是對 jQuery Mobile 的調(diào)用，因此需要在引入 jQuery Mobile 庫之后調(diào)用，具體如下：

<script src="jquery.min.js"></script>

<!-- 引入自定義 jQuery Mobile 默認配置相應的 JavaScript -->

<script src="custom-mobile.js"></script>

<script src="jquery-mobile.min.js"></script>

<!-- 引入 jQuery Mobile 的調(diào)用，包括 jQuery Mobile 的方法、事件檢測等全部應用性 JavaScript -->

<script src="my-site.js"></script>

2. 方法的調(diào)用

對于 jQuery 開發(fā)者，應該比較習慣在觸發(fā) ready 事件后執(zhí)行 JavaScript ，例如：

$(document).ready(function(){

  // 執(zhí)行 JavaScript

});

或簡寫為，

$(function(){

  // 執(zhí)行 JavaScript

});

這里說明一下，當 DOM 已經(jīng)加載，并且頁面（包括圖像）已經(jīng)完全呈現(xiàn)出時，會觸發(fā) ready 事件。

而在系列文章的上一篇中，Kayo 介紹了 pageinit 事件，它在 DOM 加載完成后（包括 jQuery Mobile 對元素的 DOM 增強），就會觸發(fā)，即它比 ready 更早的觸發(fā)。

但由于 jQuery Mobile 驅(qū)動的網(wǎng)站由 Ajax 導航，因此即使一個文檔中包含多個 'page' ，當?shù)谝粋€ 'page' 的 DOM 和內(nèi)容加載完畢后就會觸發(fā) ready 事件，而 pageint 也只需第一個 'page' 的 DOM 加載完畢后即觸發(fā)。

而最終利用那種事件作為開始調(diào)用方法的合適時機，會涉及很多方便的考慮，開發(fā)者應該根據(jù)實際情況作出選擇。

下面例舉一個例子說明如何調(diào)用 jQuery Mobile 方法，由于 jQuery Mobile 的方法很多，這里只使用 $.mobile.changePage() 方法演示如何調(diào)用方法。例子中的 JavaScript 代碼如下：

$(function(){

  $("#home").bind('swipeleft', function(){

    $.mobile.changePage('./page-2.html', {

      transition: "slide",

      role: "dialog"

    });

  });

});

上例中通過檢測向左劃動事件觸發(fā)跳轉(zhuǎn)到一個外部頁面，同時使用 'slide' 轉(zhuǎn)場動畫并以對話框形式顯示新頁面。