如何保持显示的重复元素？

Question

我有一个时间轴页面，根据我创建的活动的时间戳显示日期。活动使用Public Activity Rails gem进行。例如：

如示例所示，左侧以绿色显示多个日期。这些日期取自活动的created_at时间戳，并以用户友好的格式显示。

保持重复项不显示的最佳方法是什么。例如，我希望只显示一次6月3日的多个日期。

日期元素的HTML（循环显示）：

<li class="time-label">
  <span class="bg-red">
   <%= activity_date(activity) %>
  </span>
</li>

Ruby方法格式化日期：

  def activity_date(activity)
   local_date(activity.created_at)
  end

我在考虑使用Ruby或Javascript中的条件来限制重复显示。有什么建议吗？

Answer 1

这可能是一种方式。

首先根据用于生成此代码的代码，您可以循环，只能生成一个style而不是每个元素组一个。{/ p>

<style>.time-label[data-actdate="<%= activity_date(activity) %>"] ~ .time-label[data-actdate="<%= activity_date(activity) %>"] { display: none; }</style>
<li class="time-label" data-actdate="<%= activity_date(activity) %>">
  <span class="bg-red">
   <%= activity_date(activity) %>
  </span>
</li>

示例代码段

＆＃13;

＆＃13;

<style>.time-label[data-actdate="3 June"] ~ .time-label[data-actdate="3 June"] { display: none; }</style>
<li class="time-label" data-actdate="3 June">
  <span class="bg-red">
   3 June
  </span>
</li>

<style>.time-label[data-actdate="3 June"] ~ .time-label[data-actdate="3 June"] { display: none; }</style>
<li class="time-label" data-actdate="3 June">
  <span class="bg-red">
   3 June
  </span>
</li>

<style>.time-label[data-actdate="3 June"] ~ .time-label[data-actdate="3 June"] { display: none; }</style>
<li class="time-label" data-actdate="3 June">
  <span class="bg-red">
   3 June
  </span>
</li>

＆＃13;

＆＃13;

＆＃13;