jQuery选项卡手动选择

时间:2013-09-29 06:20:23

标签: jquery

我正在使用jQuery UI标签,我想更改按钮单击上的标签。我该怎么做?

这是我的标记,它描述了选项卡的html和jQuery选项卡的javascript代码。

<ul class="tabs">
    <li><a href="#">tab 1</a></li>
    <li><a href="#">tab 2</a></li>
    <li><a href="#">tab 3</a></li>
</ul>

<div class="tab-content">
    <div>Tab 1</div>
    <div>Tab 2</div>
    <div>Tab 3</div>
</div>

<input type="button" onclick="changetab(2)">Go to 2nd Tab</input>

<script type="text/javascript">
    (function () {

    $(".tabs-container").each(function () {
        var $history = $(this).attr('data-history');
        if ($history != undefined && $history == 'true') {
            $history = true;
        } else {
            $history = false;
        }
        var $initialIndex = $(this).attr('data-initialIndex');
        if ($initialIndex == undefined) {
            $initialIndex = 0;
        }
        $("ul.tabs", this).tabs("div.tab-content > div", { tabs: 'a', effect: 'fade', fadeOutSpeed: -200, history: $history, initialIndex: $initialIndex });
    });

    })();

    function changetab(index){
       // WHAT TO DO HERE!!!
    }
</script>

1 个答案:

答案 0 :(得分:1)

在文档中,你有active选项可用于setter或getter,所以你可以通过他的索引来激活元素:

$( "#tabs" ).tabs( "option", "active", 1 );

试试我的jsFiddle:http://jsfiddle.net/Wv5C5/

和文档:http://api.jqueryui.com/tabs/#option-active