引导选项卡在页脚菜单项单击时激活（WordPress）

Question

我有引导标签

 <div role="tabpanel" class="menu-services">
  <!-- Nav tabs --><p></p>
<ul class="nav nav-tabs" role="tablist">
<li role="presentation"><a href="#front" aria-controls="front" role="tab" data-toggle="tab"><br>
    </a></li>
<li role="presentation"><a href="#back" aria-controls="back" role="tab" data-toggle="tab"><br>
    </a></li>
<li role="presentation"><a href="#management" aria-controls="management" role="tab" data-toggle="tab"><br>
    </a></li>
<li role="presentation"><a href="#speciality" aria-controls="speciality" role="tab" data-toggle="tab"><br>
    </a></li>
</ul>
<p>  <!-- Tab panes --></p>
<div class="tab-content">
<div role="tabpanel" class="tab-pane" id="front">
<div role="tabpanel" class="tab-pane" id="back">
......
</div>

效果很好（点击标签激活它），但现在我在 WordPress 中有页脚菜单项，也需要在点击时激活标签。

例如：单击第一个菜单项会激活第一个选项卡等。 我从这个论坛尝试了很多解决方案，但没有任何效果。 我需要一个 jQuery 脚本和示例如何在页脚菜单 li 项中格式化标签，这在我的情况下效果很好。

Answer 1

在使用 javascript 时，您希望捕获您想要触发页脚中标签切换的任何内容的 onclick。

然后按照文档 (http://getbootstrap.com/javascript/#tabs-usage)，您可以按名称或索引激活选项卡。

我用这个方法设置了一个小提琴来激活标签：

$('#myTab a[href="#profile"]').tab('show')

小提琴链接 http://jsfiddle.net/mudpuddle/o74qhbwc/

$(document).ready(function() {
  $('.foot').click(function(){
    $('#myTab a[href="#' + $(this).text() + '"]').tab('show')
  });
});

Answer 2

这里是查看问题的链接 http://staffing911.com/beta/services/

在主要服务下方有一个名为外部链接的列表。 单击它们需要激活上面的选项卡。 但是，当点击时，控制台 Uncaught TypeError: undefined is not a function on

$('#myTab a[href="#' + $(this).text() + '"]').tab('show')