Как перейти на указанную вкладку в нескольких вкладок сделать с помощью инструментов jquery - PullRequest
Новая
       15

Как перейти на указанную вкладку в нескольких вкладок сделать с помощью инструментов jquery

3 голосов
/ 26 января 2012

Извините, я новичок в jquery и инструментах ...

Я использую несколько вкладок на своей странице и не могу создать ссылку, чтобы открыть вкладку, если ссылка отсутствуетобертка вкладок.

Вот мой HTML-код: 

<a href="#tab2">AN EXTERNAL LINK TO TAB2</a>
<div>
    <div class="wrap">
        <ul class="tabs">
            <li class="current"><a href="#tab1">Tab 1</a></li>
            <li><a href="#tab2">Tab 2</a></li>
            <li><a href="#tab3">Tab 3</a></li>
        </ul>
        <div class="pane">content with <a href="#tab2">A INTERNAL LINK TO TAB 2</a></div>
        <div class="pane">content</div>
        <div class="pane">content</div>
    </div>   
</div>
<div>
    <div class="wrap">
        <ul class="tabs">
            <li class="current"><a href="#tab5">Tab4</a></li>
            <li><a href="#tab5">Tab 4</a></li>
            <li><a href="#tab6">Tab 6</a></li>
        </ul>
       <div class="pane">content</div>
        <div class="pane">content</div>
        <div class="pane">content</div>
    </div>   
</div>

Правильно ли написан мой сценарий в нижней части тела?Сценарий: 

<script>

    // perform JavaScript after the document is scriptable.
    $(function() {

        $("ul.tabs").tabs("> .pane");
    });
</script>

Чего мне не хватает?Я думаю, что это возможно с несколькими вкладками ...

Большое спасибо за вашу помощь.

1 Ответ

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

Вы можете вызвать событие щелчка на нужной вкладке при нажатии целевой ссылки.В этом случае вы захотите назначить имена классов вашим вкладкам и ссылкам, поскольку они немного быстрее, чем селекторы атрибутов (например, [href=#tab2]).

Так в вашем HTML: 

<a href="#tab2" class="target-tab-2">AN EXTERNAL LINK TO TAB2</a>

...

<li><a href="#tab2" class="tab-2">Tab 2</a></li>

JS: 

$('.target-tab-2').click(function (e) { $('.tab-2').click(); e.preventDefault(); });
...