2012-01-25 39 views
6

Tôi đang tạo ứng dụng Android gốc bằng cách sử dụng PhoneGap và jQuery Mobile.jQuery và PhoneGap - Bao gồm một tệp HTML clientside với HTML hoặc JS?

Khi tôi tạo trang nhiều trang, tôi không bao gồm cùng một thanh điều hướng mọi lúc. Vì vậy, tôi đã cố gắng bao gồm một (s) html. Nhưng nó không hoạt động. Đây là những gì tôi đã thử cách này:

<!--#include file="navigation.inc.html" --> 
<!--#include virtual="navigation.inc.html" --> 
<!--#include file="navigation.inc.shtml" --> 
<!--#include virtual="navigation.inc.shtml" --> 

Trang này không được đặt trên máy chủ (web). Khi navigation.inc.shtml không phải là máy chủ, có thể bao gồm tệp bằng html hoặc javascript không?

Trả lời

4

Tôi đang gặp sự cố tương tự. Theo như tôi có thể nói, Android bỏ qua Server Side Includes.

tôi đã nhận được gần với câu trả lời với load dựa trên answer này nhưng tôi đang tham gia một cách tiếp cận hơi khác nhau:

Bất cứ nơi nào bạn cần bao gồm một tập tin bên ngoài:

<div data-include="footer"></div> 

Sau đó, , ở cuối (multipage) của tôi index.html

$('div[data-include]').each(function() { 
    $(this).load($(this).attr('data-include') + '.html').trigger('create'); 
}); 

Vấn đề là nó không hoạt động cho chế độ xem trang đầu tiên. Bất kỳ trang tiếp theo trông tuyệt vời.

+0

Xem: http://stackoverflow.com/questions/7974630/jquery-mobile-include-footer-from-external-file – tomo7

+0

Bạn đá, công trình này tuyệt vời .. –

1

Tôi đang tìm cách tiếp cận viết một lần cho data-role = "footer" và đã làm việc như được hiển thị bên dưới. Những gì tôi không thích nó 1.) của nó không phải từ một tập tin bao gồm vì vậy 2.) mã navbar là một chút khó khăn để đọc và duy trì. (Mã này KHÔNG có trong tài liệu.đã có sẵn.)

var myFooter = '<div data-role="navbar"><ul><li><a href="#myPageName" >Send</a></li><li><a href="#myPageTwo" >Set Up</a></li><li><a href="#myPageThree" >Help</a></li></ul></div>'; 

// use this code pointing to each data-role="footer" where you want this navbar 
$('div#myPageName').live("pagebeforecreate", function(){ 
     $('div#myFooterName').html(myFooter) 
}) 

sự kiện pagecreate cũng hoạt động.

1

Tôi đã sử dụng mã javascript phía máy khách như đề xuất ở trên từ Jhof.

mẫu gương cho Navigation tiêu đề:

<body onLoad="initialization()"> 
.... 
    <div template-include="nav-header"> 
    </div> 
    <script type="text/javascript"> 
    function loadTemplates() 
    { 
    $('div[template-include]').each(function() { 
     $(this).load('tpl/' + $(this).attr('template-include') + '.html').trigger('create'); 
}); 
    } 
    function initialization() { 
     .... 
     loadTemplates(); 
     .... 
    } 
    </script> 

<body> 

tôi đã tạo ra một chức năng khởi tạo nơi tôi gọi tất cả các chức năng init của tôi như loadTemplates()

tôi initializationFunction được gọi từ body.onLoad sự kiện. onLoad sự kiện cháy ở cuối phân tích cú pháp html!

Vì vậy, nó cũng hoạt động ở chế độ xem trang ban đầu.

Các vấn đề liên quan