Question

第一次发帖。所以我必须在一个看起来像这个

的元素中格式化一些文本

<div class="entry-time">
  2012-05-30T20:11:06+00:00 
</div>

我正在尝试将其格式化为moment.js更具可读性的内容。我只能用javascript从前端做到这一点。我写了一个看起来像这样的函数。

$(document).ready(function() {
    function formatDate(date) {
        formattedDate = date.text();
        var d = moment(formattedDate, "YYYY-MM-DDTHH:mm:ss");
        $(date).html( d.format("dddd, MMMM Do YYYY, h:mm:ss a"));
    };

    formatDate($('.entry-date'));
});

如果有一个元素，但是当有多个元素时，它会将所有内容格式化为一个日期。我知道这与jQuery拉入一系列元素有关，但我不知道如何用入门日期类对每个元素做的事情。

有人可以帮忙吗？提前谢谢。

Answer 1

错误的核心是jQuery .text（）方法获取“匹配元素集合中每个元素的组合文本内容，包括它们的后代”（api.jquery.com/text）而不是迭代你想要的一组元素。

这样的东西应该可以工作，将函数传递给jQuery .html（）setter方法：

$(".entry-date").html(function(index, value) {
    return moment(value, "YYYY-MM-DDTHH:mm:ss").format("dddd, MMMM Do YYYY, h:mm:ss a");
});

Answer 2

您需要使用jquery的.each方法遍历每个匹配：

$(date).each(function(){  Format date here  });

这将进入您现有的函数formatDate。

Answer 3

您需要遍历传递给函数的元素。这可以使用jQuery中的$ .each（）来完成。这是一个简单的例子：

http://jsfiddle.net/n1ck/QQYq2/1/

$(function(){
    function formatDate(dates) {
        dates.each(function(){
            //get date
            formattedDate = $(this).text();

            //format it
            var d = moment(formattedDate, "YYYY-MM-DDTHH:mm:ss");

            //replace it
            $(this).html(d.format("dddd, MMMM Do YYYY, h:mm:ss a"));
        });
    };

 formatDate($('.entry-time'));
});

Answer 4

根据您当前的代码，您可以像这样修改formatDate功能

 $(document).ready(function() {
    function formatDate(date) {
      date.each(function(){
        var formattedDate = $(this).text();
        var d = moment(formattedDate, "YYYY-MM-DDTHH:mm:ss");
        $(this).html( d.format("dddd, MMMM Do YYYY, h:mm:ss a"));

      });
  };

 formatDate($('.entry-time'));
});

你的实际班级名称是entry-time，但是你打算像formatDate($('.entry-date'));一样，因为班级entry-date不存在而无法获得任何内容。

Working Fiddle

Answer 5

你必须使用每个，因为你的选择器是类（因为你使用'。'），它也可以用于多个DOM。所以可能是你的jquery事情是返回一个数组，该数组将使用每个遍历。

$('.entry-date').each(function(){
   formatDate($(this).val());//if it is a text box
});

OR

$('.entry-date').each(function(){
   formatDate($(this).text());//if it is a label
});

Moment.js文本格式和类

5 个答案: