jQuery и jQuery UI upgrade breaks tabs

У меня есть сайт, использующий виджет jQuery UI Tabs, и он отлично работает с «старыми версиями», jQuery: 1.5.1, jQuery UI: 1.8.4.jQuery и jQuery UI upgrade breaks tabs

Выполнение других изменений/обновлений на сайте, я хотел перейти к более поздним версиям обоих пакетов, перейдя на него, перейдя к «следующей главной версии» для каждого из них пошагово. Не изменяя несколько строк моего js-кода, я мог бы перейти к jQuery 1.8.3 и jQuery UI 1.8.24, все по-прежнему работает нормально.

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

URL-адрес для страницы (все это часть установки Typo3) имеет следующий формат:

https://server.some.where/?id=49&project_id=13&action_type=display

При нажатии на вкладку, HTTP GET для базы HREF + # вкладки-X состоит из:

https://server.some.where/#tabs-2

Поскольку более ранние версии jQuery не инициировали HTTP GET, но с радостью переключали вкладки, я был в тупике. Чтение списков изменений для соответствующих выпусков jQuery, я не вижу ничего, что соответствует, но это может быть только я ... :-)

Обновление jQuery UI (1.9.2/1.10.2) создает еще одну проблему - все вкладки открываются с нуля (все divs отображаются один за другим).

Соответствующие HTML:

<div id="display-tabs"> 
    <ul class="tabs"> 
    <li><a href="#tabs-1">...</a></li> 
    <li><a href="#tabs-2">...</a></li> 
    <li><a href="#tabs-3">...</a></li> 
    </ul> 
    <div id="tabs-1">...</div> 
    <div id="tabs-2">...</div> 
    <div id="tabs-3">...</div> 
</div>

Активация вкладки виджет мертв проста:

$ ('# дисплей-вкладка') вкладки();.

JQuery извлекается из Google, также, кажется, хорошо:

<link rel="stylesheet" media="screen" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.24/themes/smoothness/jquery-ui.css" /> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.24/jquery-ui.min.js"></script>

Я устраняет большинство других видов использования JQuery на тестовом сайте временно, но эти вопросы, кажется, придерживаться , Любые идеи приветствуются ...

источник

2013-03-15 Lu-Tze

Является ли '$ ('# дисплея-вкладка') вкладки();' внутри документа готовы.? Например, '$ (function() {$ (" # display-tabs "). Tabs();});' – Mooseman

Кроме того, 'https: // ajax.googleapis.com' должно быть просто' // ajax. googleapis.com' (см. http://encosia.com/3-reasons-why-you-should-let-google-host-jquery-for-you/#protocolless по причинам) – Mooseman

Yep @Mooseman, '$ («# display-tabs»). tabs(); 'line сотрудничает с несколькими сотнями друзей, помещенными в рабочий' $ (function() {}); ' –

Проблема известна, но потребовалось некоторое время, чтобы соединить точки и использовать правильные условия поиска - извините за это!

Короче, Jquery от версии 1.9 и выше рассматривает комбинацию <base href="URL"> и ссылки на якоря <a href="#tab-X"> в качестве связующего звена, что не локальной для страницы. Такое поведение может быть более правильным, чем то, что произошло в более ранних версиях, но это изменение, которое разбивает много сайтов, построенных на фреймворках, которые основываются на базовых тегах. Моим локальным решением было предоставить полные ссылки в списке, который определяет вкладки, например: //$HTTP_HOST/$REQUEST_URI#tab-X.

Более подробная информация по этому вопросу:

источник

2013-03-19 11:48:22

jQuery и jQuery UI upgrade breaks tabs

ответ

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