вкладки начальной загрузки не работают в jquery mobile

У меня проблема с вкладками Bootstrap в моем мобильном приложении jquery. У меня есть 2 страницы с 2 отдельными вкладками.

Когда я загружу страницу, вы увидите 3 вкладки в теле, в которых говорится, что Home, Menu 1, Menu 2 эти вкладки работают нормально (Демонстрационная ссылка ). на этой странице вы увидите ссылку «Просмотр карты», которая приведет вас на другую страницу, но если вы заметите, что вкладки на этой странице не работают (не вкладки, на которых написано вкладка 1, вкладка 2, вкладка 3). Но когда я обновляю, он снова работает. Когда я нажимаю на ссылку «Главная», вкладки там не работают.

Я загрузил файл начальной загрузки на все страницы в шапке. Я даже пытался переместить их в data-role="page", но это все равно не работает.

Если я отключу ajax, он сработает, но я не хочу его отключать. Мне нужно сохранить плавный переход между страницами

Ниже приведен HTML-код вкладок.

<ul class="nav nav-tabs">
  <li class="active"><a data-toggle="tab" href="#home">Home</a></li>
  <li><a data-toggle="tab" href="#menu1">Menu 1</a></li>
  <li><a data-toggle="tab" href="#menu2">Menu 2</a></li>
</ul>

<div class="tab-content">
  <div id="home" class="tab-pane fade in active">
    <h3>HOME</h3>
    <p>Some content.</p>
  </div>
  <div id="menu1" class="tab-pane fade">
    <h3>Menu 1</h3>
    <p>Some content in menu 1.</p>
  </div>
  <div id="menu2" class="tab-pane fade">
    <h3>Menu 2</h3>
    <p>Some content in menu 2.</p>
  </div>
</div>

Ссылка на демонстрацию

Может кто-нибудь, пожалуйста, скажите мне, что может быть причиной этого и как это исправить?

Любая помощь будет оценена


jquery twitter-bootstrap jquery-mobile
person LiveEn    schedule 23.06.2017    source источник
comment
Проверка вашего демо-кода показывает несколько ошибок. Возможно, вы захотите представить демонстрацию, в которой представлен только проблемный код, чтобы мы могли исключить влияние некоторых других ресурсов, которые вы загружаете.   -  person Robert    schedule 23.06.2017
comment
@RobertC Я изменил демо. Снял лишние библиотеки JS и убрал лишние коды :)   -  person LiveEn    schedule 23.06.2017

Ответы (1)


arrow_upward
0
arrow_downward

Удалось это исправить. Проблема была в том, что у меня был один и тот же идентификатор на вкладках. Хотя это было на 2 разных страницах, когда я перехожу на другую страницу в JQM, она все еще связывала старые вкладки страницы.

Как только я изменил идентификаторы, чтобы они выглядели по-разному на обеих страницах, он начал работать.

person LiveEn    schedule 23.06.2017