Rails +引导Tabs

Question

我有一个使用引导选项卡的rails应用程序。默认选项卡是rails js.erb部分，但我不知道如何在页面加载时单击该选项卡才能使其呈现。

我的选项卡的代码如下：

<div id="artist_tabs" class="span12">
  <section class="widget widget-tabs">
    <header>
      <ul class="nav nav-tabs offset3">
        <li class="active"><%= link_to "Albums", albums_artist_path, 'data-toggle' => 'tab', :remote => true %></li>
        <li><%= link_to "Biography", artist_path(@artist), 'data-toggle' => 'tab', :remote => true %></li>
      </ul>
    </header>
    <div class="body tab-content">
      <div id="Albums" class="tab-pane active clearfix"></div>
      <div id="Biography" class="tab-pane"></div>
    </div>
  </section>
</div>

我的问题是，在页面加载时，让我的默认(活动)选项卡在不需要单击的情况下呈现部分的最佳方式是什么？

我尝试包括代码，以便在内容div中呈现分部，如下所示：

<div id="Albums" class="tab-pane active clearfix">
  <%= render 'albums', :remote => true %>
</div>

但是它会呈现在所有选项卡上。

Answer 1

我将以下代码添加到javascript文件中，从而解决了这个问题：

$.ajax({
      url: "url to default link_to path",
      cache: false,
      success: function(html){

      }
  });

如果有更好的方法来做，请张贴它。

Answer 2

我认为您错过了active div中的tab-content类。

下面是一个示例：

<div class="container-fluid">
    <div class="row-fluid">
        <div class="span8 well">
            <ul class="nav nav-tabs">
                <li class="active"> <a href="#home" data-target="#home" data-toggle="tab">Home</a>

                </li>
                <li><a href="#profile" data-target="#profile" data-toggle="tab">Profile</a>

                </li>
            </ul>
            <div class="tab-content">
                <div class="tab-pane active fade in" id="home">home tab content</div>
                <div class="tab-pane" id="profile">profile tab content</div>
            </div>
        </div>
    </div>
</div>

演示