Jquery 引导3-使用2个相同的导航选项卡控制导航面板-更新两个选项卡的活动类

我已经设置了引导选项卡，但希望有多个导航选项卡来控制一个导航窗格-一组导航选项卡位于选项卡窗格的顶部和下方。如果我单击导航选项卡2，但不使用正确的“活动选项卡”更新导航选项卡1，则以下代码有效

有人知道如何做到这一点吗？谢谢

<!-- Nav tabs 1-->
<div class="centered-pills">    
<ul class="nav nav-pills">
  <li class="active"><a href="#a" data-toggle="tab"><span>Style</span></a></li>
  <li><a href="#b" data-toggle="tab"><span>b</span></a></li>
  <li><a href="#c" data-toggle="tab"><span>c</span></a></li>
</ul>
</div> <!-- end centered-pills -->

<div class="tab-content">
<div class="tab-pane fade in active" id="a"></div>
<div class="tab-pane fade in" id="b"></div>
<div class="tab-pane fade in" id="b"></div>
</div> <!-- end tab-content -->

 <!-- Nav tabs 2-->
<div class="centered-pills">    
<ul class="nav nav-pills">
  <li class="active"><a href="#a" data-toggle="tab"><span>Style</span></a></li>
  <li><a href="#b" data-toggle="tab"><span>b</span></a></li>
  <li><a href="#c" data-toggle="tab"><span>c</span></a></li>
</ul>
</div> <!-- end centered-pills -->

---

这最终对我有用

$(document).ready(function() {
if(location.hash) {
   $('a[href=' + location.hash + ']').tab('show');
}
$(document.body).on("click", "a[data-toggle]", function(event) {
location.hash = this.getAttribute("href");
});
});
$(window).on('popstate', function() {
var anchor = location.hash || $("a[data-toggle=tab]").first().attr("href");
$('a[href=' + anchor + ']').tab('show');
});