首頁 >web前端 >js教程 >如何正確增強動態新增內容的 jQuery Mobile 標記?

如何正確增強動態新增內容的 jQuery Mobile 標記?

Susan Sarandon
Susan Sarandon原創
2024-12-09 11:21:07640瀏覽

How to Properly Enhance jQuery Mobile Markup for Dynamically Added Content?

jQuery Mobile:動態新增內容的標記增強

簡介

標記增強是在jQuery Mobile 頁面中設定樣式和啟用互動功能的關鍵步驟。然而,當動態添加或修改內容時,它可能不會自動增強。有多種方法和注意事項需要注意,以確保正確的標記增強,具體取決於所需的增強等級。

標記增強等級

增強分為三個主要等級:

  • 單一組件/小部件增強:增強單一小部件,例如按鈕、清單檢視、或複選框。
  • 頁面內容增強:增強目前頁面內容區域內的所有內容。
  • 全頁增強:增強整個頁面,包括頁眉、內容和頁腳。

標記方法增強

單一組件/小部件增強

每個jQuery Mobile 小部件都提供了一種動態增強它的方法:

  • 按鈕:$(' [type="button"]').button();
  • 清單檢視: $('#mylist').listview('refresh');
  • 複選框/單選框:$('[type="radio"]').checkboxradio();
  • 選擇選單: $('select').selectmenu();
  • 注意:觸發可折疊元素上的 ('create') 對於增強也是必要的。

頁面內容增強

增強目前頁面內容中的所有內容區域:

  • $('# index').trigger('create');

整頁增強

此方法官方並未推薦,但在極少數情況下可以使用情況:

  • $('#index').trigger('pagecreate');

阻止標記增強

在某些情況下,它可能對於防止標記增強是必要的,例如自訂小部件或CSS 樣式。可以使用多種方法:

  • 將 data-enhance="false" 屬性加入容器。
  • 將 data-role="none" 屬性加入元素。
  • 指定初始化期間要忽略的特定元素$.mobile.page.prototype.options.keepNative.

標記增強功能疑難排解

錯誤:「無法在初始化之前呼叫listview 上的方法」

在標記增強之前,確保小部件已初始化,例如:

  • $('#mylist').listview().listview('refresh');

CSS 覆蓋注意事項

要覆寫預設的jQuery Mobile CSS 樣式,請使用 !important 覆寫。例:

  • #navbar li { 背景:紅色!重要; }

以上是如何正確增強動態新增內容的 jQuery Mobile 標記?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn