时刻.js文本格式和类

Moment.js text formatting and classes

本文关键字：格式 文本 js 时刻      更新时间：2023-09-26

第一次发布。 所以我必须在如下所示的元素中格式化一些文本 

<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拉入元素数组有关，但我不知道如何使用entry-date类对每个元素所做的事情。

谁能帮忙？提前谢谢你。

问题的核心是 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");
});

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

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

这将进入您现在现有的函数格式Date。

您需要遍历传递给函数的元素。这可以通过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'));
});
​

根据您当前的代码，您可以像这样修改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不存在，因此一无所获。

工作小提琴

你必须使用每一个，因为你的选择器是一个类（因为你使用了'.'），它也可以与多个DOM一起使用。所以可能是你的jQuery的东西正在返回一个数组，该数组将使用每个数组进行遍历。

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

或

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