我正在尝试在我的Rails 4应用程序中创建一组标签内容字段。
我遇到了问题，因为我希望显示第一个标签（然后在点击它们时显示其他标签）。
我有6个制表符占位符，可以使用它们，具体取决于属性是标记为true还是false。如果一个属性为false，则只有一个标签。
如果第一个标签中排列的内容属于false属性，我无法弄清楚如何显示第一个标签（无需先点击它）。
例如，第一个选项卡位于以下位置：
<div class="dp-tab-1">
<ul class="dp-tab-list row" id="myTab">
<% if @project.package.has_background_ip == true %>
<li class="col-md-2 col-xs-6 active" >
<a href="#tab-content-first">
<span class="glyph-item" data-icon=""></span>
<span>BACKGROUND INTELLECTUAL PROPERTY</span>
</a>
</li>
<% end %>
<li class="col-md-2 col-xs-6">
<a href="#tab-content-second">
<div class="glyph-item" data-icon=""></div>
<span>DATA</span>
</a>
</li>
这两个标签的内容是：
<div class="dp-tab-content tab-content">
<div class="tab-pane row fade in active" id="tab-content-first">
<% if @project.package.has_background_ip == true %>
<div class="col-md-6 text-center">
<%= image_tag(@project.package.background_ip.bip_image, :class=>"wow fadeInLeft img-responsive", :alt=>"123") %>
</div>
<div class="col-md-6">
<div class="tab-inner">
<h4>EXISTING INTELLECTUAL PROPERTY</h4>
<p class='medium-text'>
<%= render 'projects/bipparticulars' %>
</p>
<br/>
<a class='btn btn-danger btn-line'>CHECK THESE IP TERMS</a>
</div>
</div>
<% end %>
</div>
<div class="tab-pane row fade" id="tab-content-second">
<div class="col-md-6">
<div class="tab-inner">
<h4>DATA</h4>
<p class='medium-text'>
<%= render 'projects/dataparticulars' %>
</p>
<br/>
<% if @project.package.datum.survey_link == true %>
<a class='btn btn-danger btn-line'>SURVEY</a>
<% end %>
<% if @project.package.datum.confidential == true %>
<a class='btn btn-danger btn-line'>PROPOSED NDA</a>
<% end %>
</div>
</div>
<div class="col-md-6">
<%= image_tag(@project.package.background_ip.bip_image, :class=>"wow fadeInUp img-responsive", :alt=>"123") %>
</div>
</div>
第一个标签有：
<% if @project.package.has_background_ip == true %>
如果该属性为true，则显示选项卡，一切正常。
如果该属性不正确，则选项卡不显示，其他一切正常，除了第二个选项卡不自动显示其内容 - 我首先必须单击选项卡以显示其内容。
我希望第一个真正的标签显示其内容。
我怎样才能做到这一点？
答案 0 :(得分：0)
您应该为第二个标签设置active类，以便自动选择以显示内容：
<div class="dp-tab-content tab-content">
<div class="tab-pane row fade in <%= project.package.has_background_ip == true ? 'active' : '' %>" id="tab-content-first">
<% if @project.package.has_background_ip == true %>
<div class="col-md-6 text-center">
<%= image_tag(@project.package.background_ip.bip_image, :class=>"wow fadeInLeft img-responsive", :alt=>"123") %>
</div>
<div class="col-md-6">
<div class="tab-inner">
<h4>EXISTING INTELLECTUAL PROPERTY</h4>
<p class='medium-text'>
<%= render 'projects/bipparticulars' %>
</p>
<br/>
<a class='btn btn-danger btn-line'>CHECK THESE IP TERMS</a>
</div>
</div>
<% end %>
</div>
<div class="tab-pane row fade <%= project.package.has_background_ip == false ? 'active' : '' %>" id="tab-content-second">
<div class="col-md-6">
<div class="tab-inner">
<h4>DATA</h4>
<p class='medium-text'>
<%= render 'projects/dataparticulars' %>
</p>
<br/>
<% if @project.package.datum.survey_link == true %>
<a class='btn btn-danger btn-line'>SURVEY</a>
<% end %>
<% if @project.package.datum.confidential == true %>
<a class='btn btn-danger btn-line'>PROPOSED NDA</a>
<% end %>
</div>
</div>
<div class="col-md-6">
<%= image_tag(@project.package.background_ip.bip_image, :class=>"wow fadeInUp img-responsive", :alt=>"123") %>
</div>
</div>
希望！它会有所帮助。