4

我正在通过 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 在添加时已经对其进行了初始化。

关于为什么单击选项卡无济于事的任何想法?

4

1 回答 1

0

什么时候贴标签?像下面这样加载ajax后?

$.get( baseUrl + 'blabla.html').done(
  $('.nav-tabs').tab();
);
于 2013-07-03T08:07:40.373 回答