在 foreach 循环中计算日期

Question

我有一个由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/

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

谢谢。

Answer 1

您需要一个 for each 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>