jQuery Mobile - загрузка URL-адреса напрямую, затем загрузка этого же URL-адреса с помощью хеш-функции создает в DOM новый div data-role = "page" - PullRequest
2 голосов
/ 06 сентября 2011

Вопрос может быть немного сложным для понимания, поэтому я объясню его более подробно:

Скажем, у меня есть мобильный сайт на веб-сайте, а корень сайта - http://www.site.com/mobile/

Если я загружу эту страницу без хэшей в URL, то получу один div с data-role = "page" в DOM. Если я затем нажму ссылку на другую страницу, которая может привести меня к URL http://www.site.com/mobile/#/mobile/contact.html,, я получу еще одну ссылку data-role = "page" для этой страницы, вставленную в div. Это все хорошо и правильно.

Однако, если я затем перейду по ссылке на этой странице обратно на домашнюю страницу (но не кнопку «Назад») и получу URL http://www.site.com/mobile/#/mobile/,, то вместо того, чтобы jQuery Mobile повторно использовал ту же страницу data-role = " "div, который был там при первой загрузке страницы, в DOM вставляется новый.

Это приводит к тому, что любой JavaScript, связанный с событием pagecreate, нацеленный на конкретные идентификаторы на домашней странице, не работает, поскольку идентификаторы неоднозначны.

Одна вещь, которую я заметил при проверке сгенерированного HTML, это то, что div data-role = "page", загруженный напрямую (не через хеш-загрузку Ajax), имеет атрибут data-url, который равен id этого div, но когда он загружается через хеш, тогда data-url равен значению хеша. Интересно, вызывает ли это несоответствие проблему?

1 Ответ

3 голосов
/ 06 сентября 2011

jQuery Mobile использует data-url для внутренних ссылок.Обычно он сам заполняет их и изменяет целевой контейнер data-role = "page", используя хеш-ссылки.Я предлагаю, чтобы любая сгенерированная страница имела URL-адрес данных, предварительно заполненный сервером (т.е. выполняйте работу jQuery для первой страницы, на которую попадает пользователь - если они попадают на домашнюю страницу, заполните поле data-url информацией домашней страницы,и т.д.).

Например:

<div data-role="page" id="home-page" data-url="<?php echo $_SERVER['REQUEST_URI'];?>">
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...