javascript - 使用<select>切换Bootstrap选项卡 Pane

我有2个主要标签A和B。每个标签都有2个子标签，分别是A11，A12和B11，B22。我通过A和B上的链接触发了这些子选项卡，但是现在我想将链接更改为select选项。

我尝试使用javascript做到这一点，但是当我选择A时显示A11，当我选择B时显示A22而不是B11。

可以在here中找到一个实时示例，该示例现在具有链接触发功能。

最佳答案

您可以取消注释第一个标签导航（.nav-clase）并使用hidden类将其隐藏。然后在jQuery中，您可以使用change()函数在选项更改后更改选项卡。

$('#select').change(function () {
    if($(this).val() == '0') {
    $('.nav-clase').find('[href="#clasele24"]').tab('show');
  } else {
    $('.nav-clase').find('[href="#clasele58"]').tab('show');
  }
});

JSFIDDLE