使用jQuery更改活动选项卡

Question

我在页面上有两个标签（使用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请求时，我希望该选项卡处于活动状态，我应该如何做到这一点？

- Nick Mart

Answer 1

看起来你有一个“active”类来使标签处于激活状态。在这种情况下，你可以这样做：

看起来您有一个“active”类来激活选项卡。在这种情况下，您可以直接执行以下操作：

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

- Filippos Karapetis

Answer 2

您的具体示例在文档中有说明，它说要激活标签，您需要执行以下操作：

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

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

- adeneo

Answer 3

试试这个

<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>

- Shaik Rilwan