Кнопка jQuery Mobile на внешней ссылке вызывает странную проблему - PullRequest
Новая
       5

Кнопка jQuery Mobile на внешней ссылке вызывает странную проблему

2 голосов
/ 27 марта 2012

Я использую jQuery mobile 1.0.1, если быть точным. У меня есть 2 страницы. 

Index --> Sub Page(external)

Моя гиперссылка выглядит так: 

<a href="sub_page.html" rel="external" data-transition="slide">

И я добавил этот код между jQuery и jQuery mobile <script> теги: 

$(document).bind("mobileinit", function(){
    $.mobile.ajaxLinksEnabled = false;
});

Мои индексы и подстраницы являются полными страницами со своими собственными заголовками, содержимым, нижними колонтитулами, объявлениями CSS и скриптами, поэтому я использую внешний rel.

Странное поведение:

  1. Элемент списка
  2. Я нажимаю на гиперссылку со страницы индекса
  3. открывается новая страница, все ок
  4. Я нажимаю Назад. Тоже хорошо.
  5. Я снова нажимаю на ту же гиперссылку
  6. Субстраница открывается снова, но после очень небольшой задержки (даже не секунды) появляется «Загрузка» и страница индекса появляется внутри субстраницы.

Как мне получить простую кнопку возврата на внешнюю ссылку в том же домене?

EDIT Я решил проблему с этим: 

$(document).bind("mobileinit", function(){
    $.mobile.pushStateEnabled = false;
});

между jQuery и jQuery Mobile включает в себя. Как указано в документации JQM: « мы рекомендуем отключить глобальную конфигурационную опцию $ .mobile.pushStateEnabled, чтобы избежать несовместимого поведения в некоторых браузерах. »

1 Ответ

0 голосов
/ 27 марта 2012

Вместо того, чтобы отключать навигацию AJAX, вы можете просто работать с ней, поместив все пользовательские сценарии для каждой страницы в элементы data-role="page", а не в <head> документа.Таким образом, блок кода будет вставлен в DOM при вводе страницы.

Лучшим решением было бы поместить все пользовательского JS для всего вашего сайта водин .js включить и включить его на каждой странице вашего сайта.Таким образом, весь код вашего сайта будет всегда доступен независимо от того, где пользователь приземлился или как он взаимодействует с сайтом (например, обновление страниц).

Вот мое предложение: 

<!DOCTYPE html>
<head>
    ...
</head>
<body>
    <div data-role="page">
        ...
    </div>
    <script src="/js/custom-mobile.js"></script>
</body>
</html>

Обычно это требует привязки через делегирование событий, чтобы вы могли написать код, который будет срабатывать при добавлении определенной страницы в DOM.Это важно, потому что вы не можете быть уверены, когда страница будет в DOM.По той же причине, по которой вы должны быть осторожны при использовании идентификаторов для своих элементов, все идентификаторы должны быть уникальными для всего сайта, поскольку несколько страниц могут / будут одновременно находиться в DOM.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...