jQuery и PhoneGap - Включить клиентский файл HTML с HTML или JS? - PullRequest
6 голосов
/ 25 января 2012

Я создаю нативное приложение для Android с помощью PhoneGap и jQuery Mobile.

Когда я создаю многостраничную страницу, я не всегда включаю одну и ту же панель навигации.Поэтому я попытался включить (ы) HTML.Но это не работает.Это то, что я пробовал до сих пор:

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

Эта страница не размещена на (веб) сервере.Когда navigation.inc.shtml не является сервером, возможно ли включить файл с html или javascript?

Ответы [ 3 ]

5 голосов
/ 27 февраля 2012

Я сталкиваюсь с той же проблемой.Насколько я могу судить, Android игнорирует Включения на стороне сервера.

Я был близок к ответу с load на основе этого answerно я использую немного другой подход:

Везде, где вам нужно включить внешний файл:

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

Затем в конце моего (многостраничного) index.html

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

Проблема в том, что он не работает для начального просмотра страницы.Любые последующие страницы выглядят великолепно.

1 голос
/ 04 октября 2012

Я использовал код JavaScript на стороне клиента, как предложено выше из Jhof.

пример шаблона для заголовка навигации:

<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>

Я создал функцию инициализации, где я вызываю весь свой initфункционирует как loadTemplates()

my initializationFunction вызывается из события body.onLoad.onLoad событие запускается в конце анализа html!

Так что это работает и при начальном просмотре страницы.

1 голос
/ 06 марта 2012

Я искал подход с однократной записью к data-role = "footer" и получил его работу, как показано ниже. Что мне не нравится 1.) это не из файла включения, поэтому 2.) код navbar немного сложен для чтения и поддержки. (Этот код НЕ входит в document.ready.)

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)
})

Событие pagecreate тоже работает.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...