rails 3.2 bootstrap中的可切换选项卡

Question

如果我能够在 rails 3.2 中使用可切换标签，我会很高兴。 我使用了这段代码：

div class="tabbable">
 <ul class="nav nav-tabs" id="proftabs">
  <li><a href="#profile_tab"  data-toggle="tab" >Profile</a></li>
  <li><a href="#friends_tab" data-toggle="tab">Friends</a></li>
  <li><a  href="#photos_tab" data-toggle="tab">Photos</a></li>
  <li><a  href="#videos_tab" data-toggle="tab">Videos</a></li>
  <li><a  href="#quotes_tab" data-toggle="tab">Quotes</a></li>

   <div class="tab-content">
        <div id="profile_tab" class="tab-pane">
            aaa
        </div>
            <div id="friends_tab"  class="tab-pane">
            bbbbb
            </div>
            <div id="photos_tab"  class="tab-pane">
          cccc
            </div>
            <div id="videos_tab"  class="tab-pane">
            dddd
            </div>
            <div id="quotes_tab"  class="tab-pane">
           rrrr
            </div>
    </div>
</div>

但它在 Rails 中不起作用。我的意思是，我无法看到选项卡的内容。我在互联网上红色了许多解决方案，即使在stackoverflow中，但我仍然有问题。你能帮忙吗？

编辑：

如您所见，如果我单击一个选项卡，我会看到一些东西..但它不会发生。我真的不知道该怎么办

Answer 1

我认为是因为缺少ul 标签。

<div class="tabbable">
  <ul class="nav nav-tabs" id="proftabs">
    <li class="active"><a href="#profile_tab"  data-toggle="tab" >Profil e</a></li>
    <li><a href="#friends_tab" data-toggle="tab">Friends</a></li>
    <li><a href="#photos_tab" data-toggle="tab">Photos</a></li>
    <li><a href="#videos_tab" data-toggle="tab">Videos</a></li>
    <li><a href="#quotes_tab" data-toggle="tab">Quotes</a></li>
  </ul>

  <div class="tab-content">
    <div id="profile_tab" class="tab-pane active">
        aaa
    </div>
    <div id="friends_tab"  class="tab-pane">
       bbbbb
    </div>
    <div id="photos_tab"  class="tab-pane">
       cccc
    </div>
    <div id="videos_tab"  class="tab-pane">
       dddd
    </div>
    <div id="quotes_tab"  class="tab-pane">
       rrrr
    </div>
  </div>
</div>

为读者更新答案：

最后是因为 Bootstrap.js 没有包含在 application.js 中。查看 cmets 了解更多信息。