Html 单击每个选项卡时是否可以刷新引导选项卡内容?

Html 单击每个选项卡时是否可以刷新引导选项卡内容?,html,jquery,twitter-bootstrap,Html,Jquery,Twitter Bootstrap,我有如下引导选项卡 HTML标记: <ul class="nav nav-tabs"> <li class="active"><a data-toggle="tab" href="#home">Home</a></li> <li><a data-toggle="tab" href="#menu1&quo

我有如下引导选项卡

HTML标记:

<ul class="nav nav-tabs">
  <li class="active"><a data-toggle="tab" href="#home">Home</a></li>
  <li><a data-toggle="tab" href="#menu1">Menu 1</a></li>
  <li><a data-toggle="tab" href="#menu2">Menu 2</a></li>
</ul>

<div class="tab-content">

    <div id="home" class="tab-pane fade">
    <h3>Menu 1</h3>
    <button type="button" class="btn" id="active-all">All</button>
    <button type="button" class="btn active">A</button>
    <button type="button" class="btn">B</button>
    <button type="button" class="btn">C</button>
    <button type="button" class="btn">D</button>
  </div>

  <div id="menu1" class="tab-pane fade">
    <h3>Menu 1</h3>
    <button type="button" class="btn" id="active-all">All</button>
    <button type="button" class="btn active">A</button>
    <button type="button" class="btn">B</button>
    <button type="button" class="btn">C</button>
    <button type="button" class="btn">D</button>
  </div>

  <div id="menu2" class="tab-pane fade">
    <h3>Menu 2</h3>
    <button type="button" class="btn" id="active-all">All</button>
    <button type="button" class="btn active">A</button>
    <button type="button" class="btn">B</button>
    <button type="button" class="btn">C</button>
    <button type="button" class="btn">D</button>
  </div>

</div>

基本上,我切换类bg颜色按钮。这些按钮放在我的每个选项卡上。当我点击按钮时,bg颜色类应用于按钮。当我返回到上一个选项卡或下一个选项卡时,style on按钮仍在那里。似乎选项卡没有刷新。那么,有没有什么方法可以让我每次单击tab时都刷新选项卡内容。

如果我理解正确,您需要在访问任何选项卡时删除带有颜色的类。为此,请添加这部分代码:

$('.nav.nav-tabs a').click(function(){
    $('.btn').removeClass('bg-color');
});
完整代码:

$(document).ready(function(){
  $('.btn').click(function(){
      $(this).toggleClass('bg-color');
  });
  $('.nav.nav-tabs a').click(function(){
      $('.btn').removeClass('bg-color');
  });
});

你说的刷新是什么意思?请注意,tab只需在此处显示和隐藏内容(所有dom都已装入,只需在Visibility上播放)谢谢您的回复,这正是我要查找的内容。@Rahwee,没问题。
$(document).ready(function(){
  $('.btn').click(function(){
      $(this).toggleClass('bg-color');
  });
  $('.nav.nav-tabs a').click(function(){
      $('.btn').removeClass('bg-color');
  });
});