0

我正在使用 jQuery 将时间戳转换为时间前。它工作得很好，但是当我的页面有太多时间戳时，这个代码只需要第一个时间戳，并在所有时间戳上显示第一次。

jQuery(document).ready(function() {
    var time = $('.timestamp').attr('datetime');
    var time2 = format_date(time);
    $('.timestamp').html(time2);
}); 

<abbr class="timestamp" datetime="1370993104">0 seconds ago</abbr>

<abbr class="timestamp" datetime="1370854140">0 seconds ago</abbr>

<abbr class="timestamp" datetime="1370627340">0 seconds ago</abbr>
4

3 回答 3

1

问题是，如果在选择器返回的元素集合上调用jQuery 的 getter 方法（这些方法，例如attr()、html()、等，没有参数），将只返回该集合的第一个元素的信息，而不是像你似乎认为，一个数组。text()

而且，即使它确实返回了一个数组，jQuery 也不会通过猜测您的意图来自动迭代该数组。因此，也就是说，您需要遍历选择器返回的元素，并单独更新它们，幸好大多数方法本机提供使用匿名函数的迭代。所以，也就是说，你需要使用：

$('.timestamp').html(function(){
    return $(this).attr('datetime');
});

JS 小提琴演示。

上面迭代了每个元素，并将 HTML（尽管您确实应该使用text()，因为您不需要重新创建给定元素的 HTML 内容）设置为等于datetime当前元素的，而不是您的变量较早创建。

所以，真的，我建议：

$('.timestamp').text(function(){
    return $(this).attr('datetime');
});

JS 小提琴演示。

但是，如果您更愿意使用外部变量，则可以使用以下方法（尽管我真的不明白您为什么要这样做）：

var times = $('.timestamp').map(function(){
    return $(this).attr('datetime');
}).get();

$('.timestamp').text(function(i){
    return times[i];
});

JS 小提琴演示。

参考：

于 2013-06-11T23:30:41.007 回答
1

您可以使用.html( function(index, oldhtml) )函数语法来完成。

 $('.timestamp').html(function(){
    return format_date($(this).attr('datetime'));
  });

当前代码的问题在于，使用选择器$('.timestamp').html时，您始终为所有选择器设置相同的值，而在获取$('.timestamp').attr('datetime');时只获得第一个值。

另一件事是属性 datetime 无效，因此请考虑使用data-*`` attributes, i.edata-datetime 并使用jquery data()访问属性值，前提是您不打算动态更改属性值并使用数据检索。

<abbr class="timestamp" data-datetime="1370993104">0 seconds ago</abbr>

您可以将代码更改为

  $('.timestamp').html(function(){
      return format_date($(this).data('datetime'));
  });
于 2013-06-11T23:32:12.723 回答
0

attr提供单一价值。如果您需要对每个元素的属性值做某事，则需要遍历元素。

jQuery(document).ready(function() {
    $('.timestamp').each(function (){
       var time = $(this).attr('datetime');
       var time2 = format_date(time);
       $(this).html(time2);
    });

});
于 2013-06-11T23:31:04.220 回答