在 foreach 循环中计算日期答案

【问题标题】：Calculating dates in a foreach loop在 foreach 循环中计算日期
【发布时间】：2017-11-16 16:56:14
【问题描述】：

我有一个由 wordpress 中的 foreach 循环生成的事件列表，在每个列表项中我都有一个日期、一个值和一个新日期，这是对这两者的计算。

使用 Jquery，如果该计算没有多个实例，我可以计算出该计算，但我希望调整我所拥有的内容，使其适用于每个 li。以下是我目前拥有的 HTML；

<ul class="event-list">


<li class="event">
<div class="date">13 jun 2017</div>
<div class="value">2</div>
<div class="new-date"> in here </div> 
</li>


<li class="event">
<div class="date">15 jun 2017</div>
<div class="value">3</div>
<div class="new-date"> in here </div> 
</li>

</ul>

我希望使用 jquery 实现并记住这些 div 中的所有值都是动态生成的：

<li class="event">
<div class="date">13 jun 2017</div>
<div class="value">2</div>
<div class="new-date"> 15 jun 2017 </div> 
</li>


<li class="event">
<div class="date">15 jun 2017</div>
<div class="value">3</div>
<div class="new-date"> 18 jun 2017 </div> 
</li>

</ul>

这是一个展示正在进行的工作的小提琴https://jsfiddle.net/uo2gugda/

您可以看到计算对第一个事件有效，但对第二个事件无效，我面临的另一个问题是新日期的输出 - 如何将其格式化为 2017 年 6 月 15 日而不是 2017 年 6 月 15 日星期四 00 :00:00 GMT+0100 (BST)。

谢谢。

【问题讨论】：

标签： jquery wordpress foreach

【解决方案1】：

每个 dom 元素都需要一个，格式可以使用 moment.js，在这个循环中第二天计算如下：

function addDays(date, days) {
    var result = new Date(date);
    result.setDate(result.getDate() + days);
    return result;
}

$('li.event').each(function() {
  var $this = $(this);
  var date = $this.children('.date').html();
  var days = Number($this.children('.value').html());
  var stringDate = moment(addDays(date, days)).format('DD MMM YYYY');
  $this.children('.new-date').html(stringDate);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="event-list">
  <li class="event">
    <div class="date">13 jun 2017</div>
    <div class="value">2</div>
    <div class="new-date"> in here </div> 
  </li>
  <br>
  <li class="event">
    <div class="date">15 jun 2017</div>
    <div class="value">3</div>
    <div class="new-date"> in here </div> 
  </li> 
 </ul>

【讨论】：