jQuery Mobile - Harici Dosyadan Altbilgiyi İçer

Question

jQuery Mobile uygulamasındaki tüm sayfalar tarafından kullanılabilecek bir paylaşılan altbilgi (örn. Footer.html) oluşturmak istiyorum. Ancak, html'yi harici dosyadan yükledikten sonra jQuery'yi footer navbar'daki stilleri yenilemenin bir yolunu bulamıyorum. Düşünceler çok takdir edildikten sonra. Kodun geri kalanı geçerli olduğunu varsayarsak

<div data-role="page" style="position: relative" data-theme="a" id="index"> 
    <div data-role="header"> 
     <div class="homebutton" onclick="location.href='default.html'"> 
      &nbsp;</div> 
     <h1> 
      EVENT CALENDAR</h1> 
    </div> 
    <div data-role="content"> 
     <p> 
      This is a single page boilerplate template that you can copy to build you first 
      jQuery Mobile page. Each link or form from here will pull a new page in via Ajax 
      to support the animated page transitions.</p> 
    </div> 

    <div data-role="footer" class="CSO" data-position="fixed" id="footerDiv"> 

    </div> 

    <script> 
    $('#index').live('pageinit', function (event, ui) { 
     $('#footerDiv').load('Shared/Footer.html'); 
     [Some code to refresh the footer so it gets redrawn by Jquery Mobile] 
    }); 
    </script> 

Answer 1

:

altlık.html:

<div data-role="navbar" class="CSS" data-grid="d" id="footerNav"> 
    <ul > 
     <li ><a href="#" id="a" data-icon="custom"><div>a</div></a></li> 
     <li ><a href="#" id="b" data-icon="custom"><div>b</div></a></li> 
     <li ><a href="#" id="c" data-icon="custom"><div>c</div></a></li> 
     <li ><a href="#" id="d" data-icon="custom"><div>d</div></a></li> 
     <li ><a href="#" id="e" data-icon="custom"><div>e</div></a></li> 
    </ul> 
</div> 

Index.html benim için

$('#footerDiv').load('Shared/Footer.html').trigger("create"); 

Answer 2

, ben kullanmak zorunda geri arama işlevi ve benim pageinit olayıma ekle:

$(document).on('pageinit', function(event){ 
    $("#footerDiv").load('_footer.html', function(){$(this).trigger("create")}); 
});