jquery选项卡- ajax调用后更改选项卡

Question

我使用jquery选项卡组件。这是我页面中的代码

<ul>
    <li><a href="#tabs-1">Anagrafica</a></li>
    <li><a href="#tabs-2">Corsi</a></li>
    <li><a href="#tabs-3">Pagamenti</a></li>
</ul>
<div id="tabs-1">
    //
</div>  
<div id="tabs-2">
    //
</div>
<div id="tabs-3">
    //
</div>

组件工作得很完美。

有办法在ajax调用之后更改显示的选项卡吗？

当我执行ajax调用时，将显示tab2。我想在ajax调用后显示tab3

Answer 1

是的，只需使用active选项：

$("ul").tabs("option", "active", 1); // Select tab 2

Answer 2

在没有jQueryUI的情况下尝试这些选项卡

$('ul').each(function(){
    var $active, $content, $links = $(this).find('a');

    //Set focus when the page is reloaded
    $active = $($links.filter('[href="'+location.hash+'"]')[0] || $links[0]);
    $active.parent().addClass('active');
    $content = $($active.attr('href'));

    //Hide containers
    $links.not($active).each(function () {
        $($(this).attr('href')).hide();
    });

    //Set click event
    $(this).on('click', 'a', function(e){
        $active.parent().removeClass('active');
        $content.hide();
        $active = $(this);
        $content = $($(this).attr('href'));
        $active.parent().addClass('active');
        $content.show();
        e.preventDefault();
    });
});