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>

为读者更新了答案：

结束它是因为application.js中没有包含Bootstrap.js。查看评论以获取更多信息。

rails 3.2 bootstrap中的可切换选项卡

1 个答案: