使用jquery更改活动选项卡

时间:2013-12-05 15:26:56

标签: javascript jquery twitter-bootstrap

我的页面上有两个标签(使用Bootstrap):

<ul class="nav nav-tabs" id="myTab">
  <li class="active"><a href="#home">Home</a></li>
  <li><a href="#profile">Profile</a></li> 
</ul>

<div class="tab-content">
  <div class="tab-pane active" id="home">...</div>
  <div class="tab-pane" id="profile">...</div> 
</div>

当我从配置文件选项卡发送POST请求时,我想激活此选项卡,我该怎么做?

3 个答案:

答案 0 :(得分:7)

您的确切示例位于文档中,它表示要激活您执行的选项卡:

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

http://getbootstrap.com/javascript/#tabs

答案 1 :(得分:5)

看起来你有一个“活跃”类来激活标签。在这种情况下,你可以这样做:

$("#home").removeClass("active");  // this deactivates the home tab
$("#profile").addClass("active");  // this activates the profile tab

答案 2 :(得分:0)

试试这个

<ul class="nav nav-tabs" id="myTab">
  <li <?php if empty($_POST): ?> class="active" <?php endif; ?> ><a href="#home">Home</a></li>
  <li><a href="#profile" <?php if !empty($_POST): ?> class="active" <?php endif; ?>>Profile</a></li> 
</ul>

<div class="tab-content">
  <div class="tab-pane <?php if empty($_POST): ?> active <?php endif; ?>" id="home">...</div>
  <div class="tab-pane <?php if !empty($_POST): ?> class="active" <?php endif; ?>" id="profile">...</div> 
</div>