Кордова (PhoneGap) повторная инициализация на каждой странице мобильного приложения jQuery

Я пишу простое приложение с четырьмя экранами Android, использующее Cordova и jQuery Mobile. Различные экраны расположены внутри одной страницы HTML как DIV с атрибутом data-role = "page". Я в основном скопировал шаблон многостраничного образца из документации jQuery Mobile.Кордова (PhoneGap) повторная инициализация на каждой странице мобильного приложения jQuery

http://jquerymobile.com/test/docs/pages/page-anatomy.html

навигации между страницами происходит через постоянной навигационной панели застрял в нижней части каждой страницы. Опять же, я использовал код, предложенный в документах jQuery Mobile, с небольшими изменениями.

<div data-role="footer" data-id="appNavBar" data-position="fixed"> 
    <div data-role="navbar"> 
     <ul> 
      <li><a href="#homePage" data-icon="home" data-transition="none" class="ui-btn-active ui-state-persist">Home</a></li> 
      <li><a href="#historyPage" data-icon="grid" data-transition="none">History</a></li> 
      <li><a href="#settingsPage" data-icon="gear" data-transition="none">Settings</a></li> 
      <li><a href="#aboutPage" data-icon="info" data-transition="none">About</a></li> 
     </ul> 
    </div> 
</div>

Различные Javascript библиотеки включены в головной части страницы HTML, следующим образом (application.js содержит логику приложения).

<head> 
    <title>Redacted</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="jquery/RedactedTheme.min.css" /> 
    <link rel="stylesheet" href="jquery/jquery.mobile.structure-1.1.0.min.css" /> 
    <link rel="stylesheet" href="application.css" /> 
    <script type="text/javascript" src="jquery/jquery-1.6.4.min.js"></script> 
    <script type="text/javascript" src="jquery/jquery.mobile-1.1.0.min.js"></script> 
    <script type="text/javascript" src="flot/jquery.flot.min.js"></script> 
    <script type="text/javascript" charset="utf-8" src="cordova-1.7.0.js"></script> 
    <script type="text/javascript" charset="utf-8" src="statusbarnotification.js"></script> 
    <script type="text/javascript" charset="utf-8" src="application.js"></script> 
</head>

Когда Кордова закончила загрузку и готова к использованию, она излучает сигнал «deviceready». в документах Cordova рекомендуется привязать весь код установки к прослушивателю событий, привязанному к этому сигналу. Я сделал это, как это в application.js:

function onDeviceReady() { 
    console.debug("Cordova initialized."); 
    setup(); 
} 
document.addEventListener("deviceready", onDeviceReady);

настройки() это функция, которая считывает информацию из браузера Web SQL базы данных и хранения (с использованием Кордова API определяется here) для того, чтобы сохранить пользовательские настройки и информацию об использовании между запусками приложений.

Теперь проблема: у меня создалось впечатление, что jQuery Mobile будет использовать метод jQuery ajax для загрузки любых последующих страниц после первой страницы, и при этом он будет вырезать головной раздел и пропустить прямо к DIV с атрибутом data-role = "page" и соответствующим идентификатором. Вместо этого я наблюдаю, что скрипты в разделе главы загружаются, когда я посещаю новую страницу приложения. Это происходит при первом посещении страницы в сеансе, а затем прекращается.

Похоже, что Кордова повторно инициализируется и что она снова излучает сигнал девицериады. Используя LogCat в Eclipse, я вижу сообщение об отладке, которое я разместил в функции onDeviceReady. функция setup() также вызывается снова. Это значительно замедляет процесс.

Кто-нибудь знает, где я ошибаюсь? Есть ли способ убедиться, что Кордова только загружает один раз?

Спасибо, Evan

источник

2012-05-28 evandempsey

ЗАКАНЧИВАТЬ рули (HTTP: //ccoenraets.github.io/cordova-tutorial/handlebars-templates.html) и pagelider (https://github.com/ccoenraets/PageSlider) –

У меня та же проблема с помощью PhoneGap facebook подключения плагинов. Единственным обходным решением является создание всего приложения одним html-документом с панелями, которые отображаются и скрыты как ваши разные экраны. Если вы хотите сохранить панели в отдельных файлах, можно использовать что-то вроде require.js

источник

2012-07-19 18:39:32 user1496391

Я знаю, что этот вопрос о 9 месяцев, но только в том случае, мое решение поможет кому-то еще с той же проблемой

не создавайте страницы с отображением на HTML, вместо того, чтобы создать один длинный HTML-страницу с каждой частью показа в его собственном DIV с data-role="page"

Теперь, когда вы изменяете страницу, вы можете использовать вызов JQM по $.mobile.changePage() изменить страница дисплея

egВаша страница может выглядеть следующим образом:

<div data-role="page" id="startingPage"> 
<p onClick="$.mobile.changePage('page2')">Page Link</p> 
</div> 

<div data-role="page" id="page2"> 
<p>more content here</p> 
</div>

Я знаю, это кажется нелогичным для большинства веб-разработки, но работа с PhoneGap & JQM означает НЕ работает в стандартном веб-разработки

источник

2013-03-25 16:12:13

Кордова (PhoneGap) повторная инициализация на каждой странице мобильного приложения jQuery

ответ

Смежные вопросы