在初始页面加载后将整个选项卡元素添加到页面时如何初始化 twitter bootstrap 2.0 选项卡

Question

我正在通过 Ajax 将一些 HTML 加载到页面中，其中包含一个新的可选项元素。唯一的问题是选项卡不起作用，因为引导程序已经初始化。因此，我尝试了以下代码，该代码使用 jQuery 正确定位包含选项卡的预期 ul。但是，该选项卡并未初始化。

这是 HTML（在 DOM 初始化后通过 AJAX 加载到页面中）：

<div class="tabbable tabs-left">
  <ul class="nav nav-tabs">
    <li class="active"><a href="#tab-fixes-27" data-toggle="tab">One</a></li>
    <li class=""><a href="#tab-final-27" data-toggle="tab">Two</a></li>
    <li class=""><a href="#tab-orig-27" data-toggle="tab">Thre</a></li>
  </ul>
  <div class="tab-content">
    <div class="tab-pane active" id="tab-fixes-27">
      <p>Conten1</p>
    </div>
    <div class="tab-pane" id="tab-final-27">
      <p>Conten2</p>
    </div>
    <div class="tab-pane" id="tab-orig-27">
      <p>Conten3</p>
    </div>
  </div>
</div>

然后是我的 JavaScript：

$('.nav-tabs').tab();

从我读到的内容（http://www.mightywebdeveloper.com/coding/bootstrap-2-tabs-jquery-load-content/）看来应该初始化选项卡，但它不执行任何操作。

问题是，尽管初始化了选项卡，但当我单击它们时什么也没有发生。即使我使用 .tab('show') 定位特定选项卡并且它确实显示正确。当我单击选项卡时仍然没有任何反应。

此外，如果我在事后通过附加添加它们，这些选项卡似乎工作得很好（请参阅 http://jsfiddle.net/HLj4N/9/，它在单击按钮后将上面的 HTML 附加到 div 中）。看起来有人 bootstrap.js 在添加时已经初始化了它。

对于为什么单击选项卡没有任何反应有什么想法吗？

Answer 1

什么时候贴上标签？加载ajax后如下？

$.get( baseUrl + 'blabla.html').done(
  $('.nav-tabs').tab();
);