jQuery mobile Multi Page Внутренний

У меня был поиск, все ссылки на многостраничную страницу, которые могут приблизиться к тому, чтобы помочь мне - это годы и древняя версия jqm.jQuery mobile Multi Page Внутренний

Для пояснения: Внутренняя страница представляет собой страницу, размещенную в отдельном файле, но на том же сервере, в том же каталоге, что и мой index.html. Внешняя страница будет размещаться в отдельном файле на другом сервере/домене.

Моя цель: У меня есть приложение, которое, как отдельный документ, многостраничный, который выглядит жирным. Он имеет около 20 страниц (с div-data-role = page). Я думал о том, чтобы разместить большинство этих страниц на внутренних страницах (таким образом, отдельные файлы размещались в том же месте, что и главная страница index.html).

Эта часть ведет меня ...

http://demos.jquerymobile.com/1.4.5/navigation-linking-pages/

Чтобы включить анимированные переходы страниц, все ссылки, которые указывают на внешнюю страницу (напр. Products.html) будут загружены с помощью Ajax. Чтобы сделать это ненавязчиво, структура анализирует href ссылки для формулировки запроса Ajax (Hijax) и отображает загрузчик загрузки. Все это делается автоматически с помощью jQuery Mobile.

Если запрос Ajax успешно, новое содержание страницы добавляется DOM-все мобильные виджеты автоматически инициализируются, то новая страница анимированной в поле зрения с переходом страницы.

Итак ... Возможно, я неправильно понял наличие внутренних страниц в jqm. Я получаю обновление страницы, когда ожидал, что моя страница будет загружена через ajax.

У меня есть две страницы, страница index.html, которая привязана к m1.html. Я бы ожидал, что когда я просматриваю index.html, и я нажимаю на m1.html, чтобы URL-адрес волшебным образом вытащил содержимое моей страницы div-data-role = в мою index.html DOM и дал мне URL-адрес, похожий на индекс .html # m1

Вместо этого, когда я нажимаю на ссылку m1, я получаю обновления страницы и изменения URL в m1.html

Может кто-нибудь прояснить мой (MIS) понимание?

index.html

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <meta name="format-detection" content="telephone=no" /> 
    <meta name="viewport" content="user-scalable=no, initial-scale=1, width=device-width" /> 

    <link href="/css/jquery.mobile-1.4.5.min.css" rel="stylesheet" type="text/css"/> 
    <link href="/css/jquery.mobile.icons.min.css" rel="stylesheet" type="text/css"/> 

    <script src="/jq/jquery-2.1.4.min.js" type="text/javascript"></script> 
    <script src="/jq/jquery.mobile-1.4.5.min.js" type="text/javascript"></script> 

    <title>My App</title> 
</head> 
<body> 
<form> 
    <div data-role="page" id="Menu"> 
     <div data-role="header" data-position="fixed" class="ui-title center"> 
      Main PAGE 
     </div> 
     <div id="MainContent"> 
      <ul data-role="listview"> 
       <li><a href="m1.html">m1</a></li> 
      </ul> 
     </div> 
    </div> 
</form> 
</body> 
</html>

m1.html

<div data-role="page" id="m1"> 
    <div data-role="header" data-position="fixed" class="ui-title center"> ONE 
    </div> 
    <div id="MainContent"> 
     <h1>one</h1> 
     <ul data-role="listview"> 
      <li><a href="#Menu">Menu</a></li> 
     </ul> 
    </div> 
</div>

источник

2016-09-13 Anonymous

rel="external" Удалите ссылку. Это сообщает jQM, чтобы НЕ использовать AJAX при загрузке страниц.

Смотреть подробнее здесь: http://demos.jquerymobile.com/1.4.5/navigation-linking-pages/

ссылки, которые указывают на другие домены или которые имеют отн = «внешний», данных Аякса = «ложь» или цель атрибуты не будут загружены с помощью Ajax. Вместо этого эти ссылки вызовут полное обновление страницы без анимированного перехода. Оба атрибута (rel = «external» и data-ajax = «false») имеют одинаковый эффект, но при связывании с другим сайтом или доменом следует использовать другое семантическое значение: rel = «external», а data-ajax = false "полезно для простого выбора страницы в вашем домене из-за загрузки через Ajax.Из-за ограничений безопасности структура всегда выбирает ссылки на внешние домены из поведения Ajax.

источник

2016-09-14 13:39:28 ezanker

Я отредактировал/удалил rel = "external" и разместил документы в том же каталоге, что и index.html, и страница по-прежнему обновляется, показывая новый URL-адрес. Таким образом, когда в index.html и я нажимаю на m1, url изменяется на /m1.html, а не на index.html # m1 (или что-то похожее на это). Примеры, приведенные на jquerymobile, не делают этого ясно. Есть ли у вас другие примеры? –

Я думаю, что вы можете быть правы ... и мои ожидания ошибочны ... Я замечаю, когда в m1, и я нажимаю на тег Menu (который ссылается на «#»), он правильно возвращается на страницу индекса. Мне нужно дополнительно исследовать, например, как применять события, такие как click(), к недавно добавленному содержимому DOM. Позвольте мне проверить еще несколько ... –

Неужели мои ожидания ошибаются? Я ожидал, что скрипты, загруженные в index.html, будут доступны после того, как я нажму ссылку на m1, поэтому я ожидал, что страница m1 будет вставлена в DOM, так как будет размещена многостраничная страница. Я не вставляю m1 и ни один из скриптов, загруженных из index.html, не позволяет мне полагать, что моя страница m1 рассматривается как внешняя, а не внутренняя страница. –

jQuery mobile Multi Page Внутренний

ответ

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