jQuery Mobile - Bao gồm Chân trang từ Tệp Bên ngoài

Question

Tôi muốn tạo chân trang được chia sẻ (ví dụ: footer.html) có thể được tất cả các trang trong ứng dụng jQuery Mobile của tôi sử dụng. Tuy nhiên, tôi không thể tìm thấy một cách để có được jQuery để làm mới các phong cách trong thanh điều hướng chân sau khi tải html từ tập tin bên ngoài. Sau khi suy nghĩ sẽ được đánh giá cao.

footer.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:

<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

Giả sử rằng phần còn lại của các mã có giá trị:

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

Answer 2

đối với tôi, tôi đã phải sử dụng chức năng gọi lại và thêm nó vào sự kiện pageinit của tôi:

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