Вкладки пользовательского интерфейса Jquery не работают с функцией .tabs()

Я совершенно новичок в JQUERY, и у меня есть проект, в котором я должен использовать вкладки пользовательского интерфейса JQUERY. Я загрузил одну вкладку пользовательского интерфейса и выполнил все инструкции, перечисленные на здесь мой HTML-код:

   <div id="tab">
    <ul class="tabs">
        <li><a href="#tabs-1">Tab1</a></li>
        <li><a href="#tabs-2">Tab2</a></li>
        <li><a href="#tabs-3">Tab3</a></li>
    </ul> 
    <div class="tab-content" id="tabs1">Tab1</div>
    <div class="tab-content" id="tabs2">Tab2</div>
    <div class="tab-content" id="tabs3">Tab3</div> </div>

и моя функция JQUERY:

    <script type="text/javascript">

    $(document).ready(function () {
        $('#tab').tabs();
    });
</script>

Проблема в том, что когда я запускаю страницу, она показывает вывод следующим образом: this

и я НЕ МОГУ ПЕРЕХОДИТЬ С ВКЛАДКАМИ... Я буду очень признателен за вашу помощь в этом отношении

Заранее спасибо и жду вашей оперативной помощи


jquery jquery-ui jquery-ui-tabs
person Hardworker    schedule 21.07.2012    source источник
comment
Проверьте свою консоль. Вы видите Uncaught jQuery UI Tabs: Mismatching fragment identifier. ?   -  person jcolebrand    schedule 21.07.2012

Ответы (2)


arrow_upward
3
arrow_downward

Ссылки в кнопках вкладок:

<li><a href="#tabs-1">Tab1</a></li>
<li><a href="#tabs-2">Tab2</a></li>
<li><a href="#tabs-3">Tab3</a></li>

должны соответствовать id атрибутам вкладок. Ваши ссылки используют tabs-1, tabs-2 и tabs-3, но ваши вкладки используют tabs1, tabs2 и tabs3.

Демонстрация: http://jsfiddle.net/ambiguous/kbfjS/

person mu is too short    schedule 21.07.2012
comment
УДИВИТЕЛЬНО и большое спасибо за помощь, теперь все исправлено :) - person Hardworker; 21.07.2012
comment
Еще одна проблема, с которой я сталкиваюсь в этой проблеме: когда на любой из вкладок происходит обратная публикация, вкладка перезагружается с начала, и первая вкладка появляется, даже если я вызываю событие на других вкладках, выбранная вкладка не перезагружается после обратной передачи ; как решить эту? пожалуйста, помогите мне .. заранее спасибо - person Hardworker; 22.07.2012
comment
Я решил вышеуказанную проблему, используя функцию cookie вкладок jquery ui, но теперь проблема заключается в том, что даже после закрытия и загрузки страницы вместо вкладки по умолчанию появляется последняя выбранная вкладка, теперь я полностью стек и очень нуждаюсь в вашей помощи в этом отношении. . - person Hardworker; 22.07.2012
comment
@Hardworker: вы можете настроить обратную передачу, чтобы отслеживать открытую вкладку, или удалить файл cookie после того, как он выполнил свою задачу. - person mu is too short; 22.07.2012
comment
Я нашел решение, вместо использования cookie я использовал скрытое поле, чтобы отслеживать индексы вкладок. В любом случае, спасибо - person Hardworker; 25.07.2012
comment
@Hardworker: это звучит как разумная версия настройки обратной передачи, чтобы отслеживать открытую вкладку. - person mu is too short; 25.07.2012

arrow_upward
0
arrow_downward

Переименуйте содержимое div в это, вы получили тире -.

<div class="tab-content" id="tabs-1">Tab1</div>
<div class="tab-content" id="tabs-2">Tab2</div>
<div class="tab-content" id="tabs-3">Tab3</div>
person Sang Suantak    schedule 21.07.2012