jQuery Mobile и якорные ссылки, запрашивающие неправильную страницу - PullRequest
Новая
       0

jQuery Mobile и якорные ссылки, запрашивающие неправильную страницу

3 голосов
/ 26 июня 2011

Я разработал приложение для рельсов, главной особенностью которого является страница бизнес-поиска, которая отображает страницу бизнес-результатов и форму, которая позволяет пользователю осуществлять дальнейший поиск / фильтрацию результатов.

Недавно я реализовал мобильный интерфейс для этого приложения с помощью jQuery Mobile со следующей настройкой:

Страница бизнес-результатов состоит из двух элементов с ролью данных "страница". Первая - это настоящая страница, полная результатов, которую пользователь видит при посещении, вторая страница jQuery Mobile имеет HTML-идентификатор «search-form» и содержит поля формы, необходимые для фильтрации результатов.

В строке заголовка первой страницы есть кнопка, которая ссылается на # search-форму с data-rel диалога.

Это отлично работает, если кто-то сразу переходит на site.com/bususiness и затем щелкает ссылку, jQuery Mobile правильно загружает site.com/busoples#search-form в модальное диалоговое окно, и червь работает, однако, если он начинает просмотр сеанс на любой другой странице, диалоговое окно всегда содержит содержимое своей исходной страницы.

Например, если они заходят на сайт по адресу site.com/someotherpage, то каким-то образом переходят на site.com/someotherpage#/busprises и нажимают кнопку фильтра, jQuery Mobile неправильно запрашивает и заполняет диалоговое окно содержимым site.com/ someotherpage # поиск форма

Я попытался изменить ссылку фильтра с # search-form, чтобы фактически жестко закодировать полный абсолютный путь к текущей странице с помощью # search-form, и ничего не работает.

Заранее спасибо, я схожу с ума от этого! Это единственное, что мешает мне развернуть нашу мобильную версию.

1 Ответ

0 голосов
/ 11 октября 2011

У меня такая же проблема. Любые кнопки, помещенные в #thirdPage, будут красиво распределены jQuery, но они создают свои всплывающие окна с первой страницы, загруженной пользователем. Кроме того, кнопка «Назад» в диалоговом окне будет указывать на эту первую страницу.

Одна кнопка (как показано ниже) загружается на статической странице, но то же самое относится и к динамически создаваемым кнопкам, которые я вставил через событие pagebeforecreate.

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

Кстати, тестирование в Chrome на рабочем столе работает нормально. Проблема возникает только на моем Android. Но это, скорее всего, по той же причине, о которой говорилось ранее: в Chrome я загружу саму третью страницу, а в Android - через страницы 1 и 2.

Другая особенность заключается в том, что при тестировании в Chrome на рабочем столе событие pagebeforecreate (), которое я прикрепил к #thirdPage, снова вызывается * , даже если диалог полностью находится вне элемента #thirdPage и не имеет любые пользовательские события, прикрепленные мной. Этот второй вызов pagebeforecreate () не происходит в Android.

Еще одна забавная вещь: HTML-страница с этими проблемами получила элемент от jQueryMobile с атрибутом href, который не заканчивается на html. Все остальные страницы получают этот «.html» в конце. Weird. 

  <html>
     <body>
      <div id="thirdPage" data-role="page" data-url="third">
       <a href="#desiredPopup" data-role="button" data-rel="dialog" data-transition="pop">Give me the popup</a>
      </div>
      <div id="desiredPopup" data-role="dialog" data-url="purchase" tabindex="0">
        <a href="#thirdPage" data-rel="back" data-role="button" data-inline="true" data-icon="back">Back to page "three"</a>
      </div>
     <body>
  <html>
...