divにページを読み込むjQuery Mobile

Question

jQuery Mobileのボタンをクリックして、divコンテナの別のフォルダにあるページのコンテンツをロードします（例： "files/pages/example.html"）。

どうすればよいですか？

<div data-role="page"> 
    <div id="container" data-role="content"><button id="clickButton">Click me!</button></div> 
</div> 

Answer 1

$ .mobile.loadPageはあなたが必要とする方法です。外部HTMLファイルをロードしてDOMに挿入することができます。このメソッドのデフォルトはページ全体としてロードするため、dom要素にロードするオプションを指定する必要があります。これは、例えば（未検証）コードです：

今

$('#clickButton').on("click",function(){ 
    $.mobile.loadPage("theURLofThePage",{pageContainer: $('#container')}) 
}); 

、クロスドメインのセキュリティ上の問題を忘れないでください。 （のは、それがID =「secondPage」を持っているとしましょう）ページ DIV =

$("#landingPage").live('pageinit', function() { 
      jQuery.support.cors = true; 
      $.mobile.allowCrossDomainPages=true; 
     }); 

をまた、あなたがロードしているページはデータ役割に包まれている必要があります。私は追加することによって、Firefoxでこの作業を行うために管理しました。負荷後、データ・役割についてのトリガー= ID = secondPage div要素を持つページ：

$('#secondPage").trigger('pagecreate');