$ .ajax（）でロードされた要素にjQuery Mobile CSSが表示されないのはなぜですか？

Question

私はjQuery Mobileでウェブサイトを作った。 jQuery $.ajax()関数でHTMLコンテンツを読み込んでいます。

ロードされたコードには、ボタンや拡張可能なセクションなどの機能が含まれています。

ただし、ロードされた要素のどれもモバイル機能を備えていません。 jQuery Mobile CSSは適用されていません。

これは、jQuery MobileがすでにAjaxを使用してページをナビゲートする方法と関係がありますか？動的にロードされなかったHTMLコンテンツは、jQuery Mobileスタイルを保持します。

Answer 1

あなたが更新する必要がjQMは、新しい要素のために制御します。

• http://jquerymobile.com/demos/1.0.1/docs/pages/page-scripting.html

は、ページのプラグインは、ほとんどのウィジェットが自動的に使用pagecreateイベントをディスパッチする新しいマークアップ
を強化 - 自分自身を初期化する。ウィジェットプラグインスクリプトとして が参照されると、ページ上で見つかったウィジェットのインスタンスが自動的に拡張されます（ ）。あなたは Ajaxを介してコンテンツに新しいマークアップクライアント側または負荷を生成し、ページに注入場合

しかし、あなたは 新しい内に含まれるすべてのプラグインの自動初期化を扱う に作成したイベントをトリガすることができますマークアップ。これは任意の要素（ページ div自体さえ）でトリガーされ、各プラグイン （リストビューボタン、選択など）を手動で初期化する作業を保存します。

のAjax経由で をロードされたHTMLマークアップ（たとえば、ログインフォーム）のブロック場合たとえば、自動的 にそれが含まれている すべてのウィジェット（この場合は、入力やボタン）を形質転換するために作成するイベントをトリガは、拡張バージョン。このシナリオのためのコードは次のようになります。

$(...new markup that contains widgets...).appendTo(".ui-page").trigger("create"); 

は、リフレッシュ対作成：イベントを作成し、いくつかのウィジェットが持つメソッド をリフレッシュ間の重要な違いがあることが重要な区別
注意を。 createイベントは、1つまたは複数のウィジェットを含む未加工の マークアップを改善するのに適しています。リフレッシュ方法は、 が、すでにプログラムされた で操作された既存の（すでに強化された）ウィジェットで使用され、UIを更新して一致させる必要があります。あなたは、動的データ・役割=ページ作成後にリストビューの属性、そのリストの親要素に作成トリガ で新しい 順不同リストを追加ページを持っていた場合

は例えば、希望は、書式付きリストビューにそれ 変換しますウィジェット。さらにリストアイテムが プログラムで追加された場合、リストビューの更新メソッドを呼び出すと、新しいリストアイテムのみが拡張状態に更新され、 既存のリストアイテムは変更されません。

Answer 2

$(document).ready(function() { 
    $.ajax({ 
     url : "rest/developers", 
     success : function(data) { 
      $('#anomaly-div').html("<a data-role='button' data-theme='b'>test-http</a>").trigger("create"); 
     }, 
     error : function(error) { 
      console.log("error updating table -" + error.status); 
     } 
    }); 
}); 

Answer 3

.trigger("create")

私のため