使用jquery格式化多个php日期

Question

我有来自PHP yyyy-mm-dd hh:mm:ss的{​​{1}}格式的日期，以适应我的mysqli数据库。我希望它采用以下格式：

date('Y-m-d H:i:s')

---

我正在使用插件jquery-dateFormat，我已经这样做了。这会使每个人都变成正确的格式：

1) /*x hours ago*/ <span class="time">2014-02-24 10:38:19</span>

2) /*Yesterday*/ <span class="time">2014-02-23 16:38:19</span>

3) /*Feb 22nd*/ <span class="time">2014-02-22 16:38:19</span>

4) /*2013 Feb 22nd 16:38*/ <span class="time">2013-02-22 16:38:19</span>

---

示例html文档：

if ("<?php echo $date ?>" === $.format.date($('.time').html(), "yyyy-MM-dd") || "<?php echo $yesterday ?>" === $.format.date($('.time').html(), "yyyy-MM-dd")) {
    $('.time').html($.format.prettyDate($('.time').html()));
} else if ("<?php echo $year ?>" !== $.format.date($('.time').html(), "yyyy")) {
    $('.time').html($.format.date($('.time').html(), "MMM D - yyyy"));
} else {
    $('.time').html($.format.date($('.time').html(), "MMM D"));
}

我希望输出为：

<span class="time">2014-02-24 10:38:19</span> <p>
<span class="time">2014-02-23 16:38:19</span> <p>
<span class="time">2014-02-22 16:38:19</span> <p>
<span class="time">2013-02-22 16:38:19</span> <p>

---

目前上面的代码只会格式化第一个x hours ago Yesterday Feb 22nd Feb 22nd - 2013 而不是所有这些代码？

Answer 1

修改

如果您愿意自己动手​​，我可以对现有代码做出的要点是：

尝试在代码中使用jQuery的$.each()函数和$(this)来循环遍历每个标记并一次处理一个标记。执行$('.time')并且有多个匹配项时，jQuery会返回一个对象数组，这些对象无法像您尝试使用它一样在if语句中使用。

这个稍微修改过的代码版本可以解决这个问题：

var today = "<?php echo $today; ?>",
    yesterday = "<?php echo $yesterday ?>",
    year = "<?php echo $year ?>";

$('.time').each(function() {
   $this = $(this);
   if (today === $.format.date($this.html(), "yyyy-MM-dd") || yesterday === $.format.date($this.html(), "yyyy-MM-dd")) {
      $this.html($.format.prettyDate($this.html()));
   } else if (year !== $.format.date($this.html(), "yyyy")) {
       $this.html($.format.date($this.html(), "MMM D - yyyy"));
   } else {
       $this.html($.format.date($this.html(), "MMM D"));
   }
});

请参阅jsFiddle http://jsfiddle.net/YZS49/1/

但是，您可能仍想考虑使用下面提到的插件。

原创（仍然是我的建议）：

您可能对moment.js感兴趣。它内置了相对时间函数fromNow（）。

例如使用此PHP：

<p><abbr class="time" title="<?php echo date('Y-m-d H:i:s'); ?>"><?php date('M dd'); ?></abbr></p>

要生成这样的HTML：

<p><abbr class="time" title="2012-02-22 20:20:20">Feb 22</abbr></p>
<p><abbr class="time" title="2014-01-22 20:20:20">Jan 2</abbr></p>
<p><abbr class="time" title="2014-02-24 15:20:20">Feb 24</abbr></p>

（如果javascript不起作用，短版本可以显示）

以及javascript：

$('abbr.time').each(function(){
   $this = $(this);
   $this.text(moment($this.attr('title')).fromNow());
});

将产生以下内容：

<p><abbr class="time" title="2012-02-22 20:20:20">2 years ago</abbr></p>
<p><abbr class="time" title="2014-01-22 20:20:20">a month ago</abbr></p>
<p><abbr class="time" title="2014-02-24 15:20:20">28 minutes ago</abbr></p>

（javascript替换了标签内的文字，但留下了标题。这意味着用户可以将指针悬停在“2年前”，仍然可以看到确切的时间戳。

该插件还支持各种语言和时间格式 - read the docs。

Answer 2

这有效！

$( '.time' ).each(function( index ) {
if ("<?php echo $date ?>" === $.format.date($(this).html(), "yyyy-MM-dd") || "<?php echo $yesterday ?>" === $.format.date($('.time').html(), "yyyy-MM-dd")) {
    $(this).html($.format.prettyDate($(this).html()));
} else if ("<?php echo $year ?>" !== $.format.date($(this).html(), "yyyy")) {
    $(this).html($.format.date($(this).html(), "MMM D - yyyy"));
} else {
    $(this).html($.format.date($(this).html(), "MMM D"));
}
});