有序列表
　　<div data-role="content">
　　　　<ol data-role="listview" data-theme="g">
　　　　　　<li><a href="#"> List 1</a></li>
　　　　　　<li><a href="#"> List 2</a></li>
　　　　　　<li><a href="#"> List 3</a></li>
　　　　</ol>
　　</div>

只讀列表
　　<div data-role="content">
　　　　<ul data-role="listview" data-inset="true">
　　　　　　<li><a href="#"> List 1</a></li>
　　　　　　<li><a href="#"> List 2</a></li>
　　　　　　<li><a href="#"> List 3</a></li>
　　　　</ul>
　　</div>

可分割按鈕列表
　　<div data-role="content">
　　　　<ul data-role="listview" data-theme="g" data-split-icon="gear" data-split-theme="d">
　　　　　　<li><a href="#"> List 1</a><a href="#"></a></li>
　　　　　　<li><a href="#"> List 2</a><a href="#"></a></li>
　　　　　　<li><a href="#"> List 3</a><a href="#"></a></li>
　　　　</ul>
　　</div>

含有氣泡式計數列表
　　<div data-role="content">
　　　　<ul data-role="listview" data-theme="g">
　　　　　　<li><a href="#"> List 1</a><span class="ui-li-count">33</span></li>
　　　　　　<li><a href="#"> List 2</a><span class="ui-li-count">222</span></li>
　　　　　　<li><a href="#"> List 3</a><span class="ui-li-count">111</span></li>
　　　　</ul>
　　</div>

配置選項。
　　jquery Mobile 在開始運行的時候，它會在document 對象上觸發一個mobileinit 事件。我們可以通過該事件重寫默認的相應的函數。配置各種屬性參數。
　　使用方法如下：
　　　　$(document).bind("mobileinit",function(){
　　　　　　　　//在這里添加用戶自定義代碼。
　　　　})
　　　　<script src="jquery.js"></script>
　　　　<script src="自定義事件處理函數的js文件"></script>
　　　　<script src="jquerymobile.js"></script>

　　　　為開發者提供一個對象：$.mobile. 該對象的作用是配置各種選項及默認配置。
　　　　$(document).bind("mobileinit",function(){
　　　　　　$.mobile.foo = "foo";l
　　　　})
　　　　可配置選項：
　　　　1.ns
　　　　　　類型：字符串，默認是非空字符串。
　　　　　　用法：$.mobile.ns="mynamespace"
　　　　　　描述：自定義命名空間，避免命名空間。
　　　　2.autolnitializePage
　　　　　　類型：布爾類型,默認為true。
　　　　　　用法：$.mobile.autoInitializePage = false
　　　　　　描述：默認情況下，當頁面DOM元素準備就緒后，程序會自動加載$.mobile.initializePage 函數 如果設置為 false
　　　　　　頁面 就不會成立，并保持隱藏狀態。
　　　　3.subPageUrlKey
　　　　　　類型：字符串，默認值是 ui-page.
　　　　　　用法：$.mobile.subPageUrlkey = "page"
　　　　　　描述：改變jQuery Mobile 視圖在 URL 地址中的key 參數名，當選參數改成 subPageUrlKey = "page "時 url 地址會被改成
　　　　　　example.html?page=subpage。
　　　　4.activePageClass
　　　　　　類型：字符串，默認值是 ui-page-active
　　　　　　用法：$.mobile.activePageClass = “ui-ns-page-active”。
　　　　　　描述：主要功能是自定義活動狀態頁面和過度狀態時的視圖css樣式。
　　　　5.activeBtnClass
　　　　　　類型：字符串，默認值是ui-btn-active
　　　　　　用法：$.mobile.activeBtnClass = "ui-ns-page-active"
　　　　　　描述：該選項的主要功能是自定義處于活動狀態的那妞的樣式風格。
　　　　6.ajaxEnabled
　　　　　　類型：布爾值，默認值是true
　　　　　　用法：$.mobile.ajaxEnabled = false
　　　　　　描述：設置當單擊連接或提交表單或按鈕時，是否使用Ajax方式加載頁面或提交數據。
　　　　7.hashListeningEnabled
　　　　　　類型：布爾值，默認值是true；
　　　　　　用法：$.mobile.hashListeningEnabled = false
　　　　　　描述：設置是否自動監聽和處理location.hash的變化，如果設置為false ，可以使用手動的方式處理hash 的變化，或者簡單使用連接
　　　　　　　　　　地址進行跳轉。
　　　　8.defaultPageTransition
　　　　　　類型:字符串，默認值是slide
　　　　　　用法：$.mobile.defaultPageTransition = “fade”
　　　　　　描述：該選項參數主要設置頁面切換默認的效果，如果設置為none ，頁面切換時就不會有效果，可選的參數 slideup (左右滑入)
　　　　　　　　slideup(由下向上滑動) slidedown （由上像下滑入）pop （由中心）
　　　　9.touchOverflowEnabled
　　　　　　類型：布爾值，默認值是false
　　　　　　用法：$.mobile.touchOverflowEnabled = true
　　　　　　描述：是否使用設備的原生態滾動特性。
　　　　10.defaultDialogTransition
　　　　　　類型：字符串,默認值是pop
　　　　　　用法：$.mobile.defaultDialogTransition = "none"
　　　　　　描述:設置Ajax 對話框的彈出效果，若設置為none 則沒有過度效果。
　　　　11.minScrollBack
　　　　　　類型：字符串，默認值是150
　　　　　　用法：$.mobile.minScrollBack = “200”
　　　　　　描述：當滾動超出所設置的高度時才會觸發滾動位置記憶功能。
　　　　12.loadingMessage
　　　　　　類型：字符串默認值是loading
　　　　　　用法：$.mobile.loadingMessage = "加載中"
　　　　　　描述：設置頁面加載狀態的文本內容。如果設置為false,則不顯示任何內容。
　　　　13.pageLoadErrorMessage
　　　　　　類型：字符串，默認值為 Error Loading Page
　　　　　　用法：$.mobile.pageLoadErrorMessage = "頁面加載失敗"
　　　　　　描述：設置當Ajax頁面請求失敗時顯示的提示的文本內容
　　　　14.gradeA
　　　　　　類型：布爾值，默認值是$.support.mediaquery 的值
　　　　　　用法：$.mobile.gradeA
　　　　　　描述：當瀏覽器符合所有的支持的條件時候才會返回true.

更多專業前端知識，請上 【猿2048】www.mk2048.com

總結

以上是生活随笔為你收集整理的jquery mobile 移动web(5)的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。