jQuery Mobile を使用して動的に追加されたコンテンツを効率的に強化するにはどうすればよいですか?

jQuery Mobile: 動的に追加されたコンテンツのマークアップ拡張

概要

の拡張動的に作成されたコンテンツは、jQuery Mobile の特徴に確実に準拠しています。スタイリング。このプロセスは重要ですが、リソースを大量に消費するため、更新されるコンポーネントに基づいて選択的な強化を行うことをお勧めします。

強化レベル

3 つの強化レベルが存在し、そのレベルによって分類されます。リソース消費:

1. 単一コンポーネント/ウィジェットを強化
2. ページを強化content
3. ページ コンテンツ全体を強化する

単一コンポーネント/ウィジェットを強化する

注: 強化方法は次のとおりです。現在/アクティブなページでのみ使用されます。動的に挿入されたページの拡張は、DOM に挿入されると行われます。

例: ボタンの拡張:

$('[type="button"]').button();

ページ コンテンツの拡張

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

ページ全体を強化コンテンツ

注意: 意図しない副作用のリスクがあるため、trigger('pagecreate') は慎重に使用してください。

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

マークアップ強化を防ぐ方法

特定のマークアップの強化を防ぐには要素を使用するには、次のいずれかの方法を使用します:

方法 1:

data-enhance="false"

方法 2:

data-role="none"

メソッド3:

$(document).bind('mobileinit',function(){
  $.mobile.page.prototype.options.keepNative = "select, input";
});    

マークアップ拡張の問題

エラー: "初期化前にリストビューのメソッドを呼び出すことができません"

解決策: コンポーネントを初期化するマークアップを拡張する前に:

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

マークアップ オーバーライドの問題

デフォルトの jQuery Mobile CSS スタイルをオーバーライドするには、CSS ルールで !重要なフラグを使用します。

例:

#navbar li {
  background: red !important;
}

以上がjQuery Mobile を使用して動的に追加されたコンテンツを効率的に強化するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。