如果 Ruby on Rails 中有设置限制，如何显示特定的 div 元素

Posted 2023-05-09

【中文标题】如果 Ruby on Rails 中有设置限制，如何显示特定的 div 元素

【英文标题】：How to show specific div element if there is a set limit in Ruby on Rails

【发布时间】：2020-11-05 21:51:29

【问题描述】：

我有这个我想要实现的 rails 应用程序。

如果条件limit(4) 显示 4 个 div 元素，如何自动显示静态 div 元素？我想要实现的是在浏览器中显示 4 个邮箱时，这将只显示 Apply for our Program div 元素的静态元素。

<div class="row">
    <% @posts.limit(4).each do |post| %>
        <h2> <% post.title %> </h2>
    <% end %>
</div

<div class="row">
   <div class="border-box">
      <h1>Apply for our Program</h1>
      <a href="#">Link to Program</a>
   </div>
</div

如果显示 4 个帖子，我只想显示这个静态 div 元素。除非帖子不等于 4 时隐藏此静态 div 元素。

<div class="row">
   <div class="border-box">
      <h1>Apply for our Program</h1>
      <a href="#">Link to Program</a>
   </div>
</div

rails 应用程序中是否有一个特殊功能，如果它等于 4，则计算显示的 div，然后显示静态 div 元素。或者如果计数等于 4，我是否需要 Jquery 函数来显示静态元素？

【参考方案1】：

不需要任何JS。只需将第二个 div 放在里面

<% if @posts.count >= 4 %>
...
<% end %>

【讨论】：

绝对解决问题.. 谢谢你的这个。 （弓）

另请注意，如果您之前在控制器中加载了@posts，调用@posts.limit(4) 仍将运行另一个SQL 查询。调用 @posts.first(4) 将为您提供（最多）前四条记录，而无需重新运行查询。

【参考方案2】：

如果您需要根据其他事件而不是帖子数量来制作动画或管理显示/隐藏，则可以使用 javascript 实现此目的。

我会用 jQuery 向你展示，但这可以用普通的 JS 轻松实现

<div class="row">
 <% @posts.limit(4).each do |post| %>
    <h2> <% post.title %> </h2>
 <% end %>
</div>

<div class="row box--apply hidden">
  <div class="border-box">
    <h1>Apply for our Program</h1>
    <a href="#">Link to Program</a>
  </div>
</div>

在哪里

.hidden  display:none; 
.show  display: block; 

然后在 JS 中

$(function() 
  const nH2 = $('H2').length;
  const $box = $('.box--apply');

  if(nH2 >= 4) 
    $box.removeClass('hidden').addClass('show');
  
);

并且，可以根据您的要求扩展逻辑。