всегда устанавливать первые вкладки на выбранные и всегда показывать содержимое выбранных вкладок jquery ui tabs - PullRequest
Новая
       19

всегда устанавливать первые вкладки на выбранные и всегда показывать содержимое выбранных вкладок jquery ui tabs

0 голосов
/ 26 февраля 2012

Я использую вкладки jquery ui, и у меня есть страница с вкладками внутри вкладок, и содержимое внутренних вкладок загружается через Ajax (путем передачи URL-адреса в атрибут href моего элемента a). HTML выглядит так: 

<div class="tabs">
<ul>
<li><a href="#tabs-1">Tab 1</a></li>
<li><a href="#tabs-2">Tab 2</a></li>
<li><a href="#tabs-4">Tab 3</a></li>
</ul>

<div id="tabs-1" class="tabs">
<p>Some content for parent tabs 1</p>

<!-- Inner tabs -->

<ul>
<li><a href="ajax/content1.html">Inner Tab 1</a></li>
</ul>

</div>

<div id="tabs-2" class="tabs">
<p>Some content for parent tabs 2</p>

<!-- Inner tabs -->

<ul>
<li><a href="ajax/content2.html">Inner Tab 2</a></li>
<li><a href="ajax/content3.html">Inner Tab 3</a></li>
</ul>

</div>

<div id="tabs-3" class="tabs">
<p>Some content for parent tabs 3</p>

<!-- Inner tabs -->

<ul>
<li><a href="ajax/content4.html">Inner Tab 4</a></li>
<li><a href="ajax/content5.html">Inner Tab 5</a></li>
<li><a href="ajax/content6.html">Inner Tab 6</a></li>
</ul>

</div>

</div>

Я хочу сделать 2 вещи:

1- Поскольку содержимое внутренних вкладок загружается через Ajax, содержимое этих вкладок еще не отображается, когда пользователь впервые заходит на страницу. Таким образом, пользователь должен щелкнуть, чтобы открыть содержимое внутренних вкладок, но я хочу, чтобы, когда пользователь впервые заходит на страницу, я хотел, чтобы содержимое предварительно выбранных внутренних вкладок по умолчанию отображалось на экране. пользователь (вместо некоторого пустого содержимого)

2- Я знаю, что могу установить, какие вкладки выбираются при инициализации, используя параметры selected вкладок, например: 

$( ".selector" ).tabs({ selected: 0 });

При этом я всегда буду выбирать первую вкладку (но это работает только тогда, когда мы впервые инициализируем вкладки). Теперь я хочу, чтобы ВСЕГДА была выбрана первая внутренняя вкладка, когда пользователь нажимает на родительские вкладки. Другими словами, если пользователь нажимает на вкладку 1, я хочу, чтобы была выбрана внутренняя вкладка Внутренняя вкладка 1, если пользователь нажимает на вкладку 2, я хочу, чтобы была выбрана внутренняя вкладка Внутренняя вкладка 2, и если пользователь нажимает на Вкладка 3, я хочу, чтобы была выбрана внутренняя вкладка Внутренняя вкладка 4. Я также хочу, чтобы содержимое выбранной вкладки было ВСЕГДА видимым.

Надеюсь, я был достаточно ясен в своем объяснении. Пожалуйста, кто-нибудь, помогите мне с этим.

Спасибо

1 Ответ

0 голосов
/ 26 февраля 2012

Для того, чтобы ваш первый пример содержал образец контента, используйте что-то вроде ниже. Для innertab1 вам не требуется перемещаться по URL, так как контент будет загружаться через AJAX. Вместо этого для href укажите div id, в котором будет храниться содержимое вкладок, как показано ниже: 

    <ul>
        <li><a href="#innertab1">Inner Tab 1</a></li>

    </ul>
    <div id="innertab1">
        Sample content of inner tab 1. This content will be loaded via ajax
    </div>

Кроме того, я не уверен, что понимаю ваше второе замечание. Когда я нажимаю на tab1, я вижу внутреннюю tab1, и когда я нажимаю на tab2, я вижу внутреннюю tab2. В чем проблема?

...