Question

如何以编程方式激活特定标签？我在阅读了在线jQuery文档后尝试了以下代码：

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

这会显示指定的选项卡内容，但它不会突出显示所选选项卡的标题，这是当我手动单击选项卡标题时发生的情况。我也试过了“刷新”选项，没有任何成功。我在jQuery的tabs（）

之上使用Bootstrap 3的TAB css

Answer 1

您可以通过在所需标签上触发.click()事件来手动点击该标签来阻止用户。

您还可以看到bootstrap's own jQuery plugin to manage your tabs 。

Answer 2

在CSS中尝试：

#tabs .ui-tabs-active {
  background: yellow;
}

::source::

Answer 3

由于Bootstrap的标签CSS使用active类，因此在激活标签时添加类 - Demo

$( "#MyTabsDiv" ).tabs({
    activate: function( event, ui ) {
        $(ui.newTab).addClass('active')
        $(ui.oldTab).removeClass('active')  
    }
});

或使用on（） - Demo

附加到事件

$("#MyTabsDiv").on( "tabsactivate", function( event, ui ) {
    $(ui.newTab).addClass('active')
    $(ui.oldTab).removeClass('active')  
});

jQuery Tabs手动激活

3 个答案: