Используя автономный кеш приложения в iOS и в полноэкранном режиме приложения, он открывает другие страницы в Safari вместо приложения - PullRequest
Новая
       39

Используя автономный кеш приложения в iOS и в полноэкранном режиме приложения, он открывает другие страницы в Safari вместо приложения

0 голосов
/ 01 декабря 2011

Я создаю автономное приложение для планшета / телефона в HTML5 для удаленного сбора данных в местах, где нет сотовых вышек. Он использует манифест кэша автономного приложения для сохранения страниц в браузере. Я пытаюсь заставить его работать в Safari и Android.

В настоящее время существует несколько отдельных веб-страниц для моего сайта (index.html, load.html и sync.html). Я хочу иметь возможность загружать каждую страницу и запускать разные javascript, когда каждая страница загружена.

Первоначально у меня была главная страница указателя (которая выполняла функцию начальной загрузки приложения), и я использовал функцию .load () jQuery для загрузки различных файлов подкачки (только фрагменты html) в div основного дисплея при нажатии кнопки меню. была нажата. Это работало довольно хорошо с iPhone. Однако при попытке его на Android, когда сайт уже был кэширован, а устройство находилось в режиме полета, поэтому оно не может подключиться к серверу, страница по какой-то причине не смогла бы загрузить HTML-код с внешней страницы, поэтому получить пустой экран. Я сузил его до сбоя функции jQuery .load () в Android при загрузке страниц из кэша.

Итак, я попытался разделить отдельные страницы и отразить все HTML, JavaScript, CSS и код заголовка на каждой странице (не очень эффективно). Таким образом, каждая страница может работать отдельно. Это работало нормально в Android и iPhone в веб-браузере, когда вы переходили по простой ссылке для загрузки других страниц. Однако , когда я перехожу в режим приложения на iPhone (то есть вы сохраняете веб-страницу на домашнем экране, чтобы она отображалась как значок реального приложения, а затем запускаете ее оттуда, она выглядит почти на весь экран, кроме строки состояния) затем щелкните значок меню, чтобы загрузить файл sync.html, например, он открывает страницу в Safari вместо того, чтобы оставаться в полноэкранном режиме «приложения».

Есть ли способ открывать отдельные веб-страницы, которые должны кэшироваться в полноэкранном режиме приложения на iPhone? Я не хочу, чтобы другие страницы загружались в Safari, поскольку там меньше размер экрана.

Единственный другой метод, который я могу придумать, - это спрятать все фрагменты html в div на главной странице индекса, а затем показать и скрыть div в зависимости от того, какая кнопка меню нажата. Это может выглядеть чище и быстрее, но просто интересно, есть ли лучший способ сделать это?

1 Ответ

0 голосов
/ 01 декабря 2011

На данный момент самое чистое решение, которое я мог придумать, было таким:

HTML: 

<section id="pageContent">
   <div id="homePage" class="hidden">
       <?php include_once 'home.html'; ?>
   </div>

   <div id="loadPage" class="hidden">
       <?php include_once 'load.html'; ?>
   </div>

   <div id="syncPage" class="hidden">
       <?php include_once 'sync.html'; ?>
   </div>
</section>

CSS: 

.hidden {
    display: none;
}

Это позволяет вам сохранять контентстраницы в отдельных файлах.А поскольку HTML-код в этих файлах включен в индексную страницу при загрузке страницы, все HTML-файлы также кэшируются.Теперь просто нужно скрыть и показать различные страницы.

Затем я использовал простой jQuery, чтобы показать и скрыть каждую страницу, и настроил несколько простых функций JavaScript для отображения каждой отдельной страницы.Например, 

function showSyncPage()
{
    $('#pageContent').children().hide();   // Hide all the other divs (other pages)
    $('#syncPage').show();    // Show the sync page
}

Затем добавьте эти вызовы функций в обработчики onclick на ваших кнопках / ссылках, чтобы открыть каждую страницу.Например, 

<a class="button" onclick="showSyncPage()">Sync</a>

Теперь у вас есть работающая навигационная система, которая загружает все страницы в iPhone / Android и даже в режиме приложения iPhone без загрузки Safari.

...