css - 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 中。查看评论以获取更多信息。