Question

我在如何更新网站帖子中的分钟方面遇到了一些麻烦。

所以说我有这个：

<small>posted <span class="updateMinutes">20 minutes </span> ago</small>
<small>posted <span class="updateMinutes">33 minutes </span> ago</small>

我正在尝试更新跨度内的分钟数。我遇到的问题是只有一个跨度得到更新而另一个没有。我的jquery代码如下：

setInterval(function(){
            var minute = $('.updateMinutes').text().match(/\d+/);
            $('.updateMinutes').html((parseInt(minute[0]) + 1).toString() + ' minutes');
 }, 60000);

我也在阅读jquery的.each()方法，但我不确定如何在这种情况下实现它，以及它是否是一个可行的解决方案。我在使用.each()时尝试过的代码：

setInterval(function(){
        $('.updateMinutes').each(function(){
            var minute = $('.updateMinutes').text().match(/\d+/);
            $('.updateMinutes').html((parseInt(minute[0]) + 1).toString() + ' minutes');
        });
 }, 60000);

非常感谢任何帮助！感谢。

Answer 1

在.each中，您需要对该特定元素执行更新。您现在只需将常规选择器代码放入其中，但如果使用$(this)代替$('.updateMinutes')，您将更接近您想要的内容。即。

setInterval(function(){
        $('.updateMinutes').each(function(){
            var $currentEl = $(this);
            var minute = $currentEl.text().match(/\d+/);
            $currentEl.html((parseInt(minute[0]) + 1).toString() + ' minutes');
        });
 }, 60000);

请注意，setInterval无法保证在传入的时间间隔内完全触发，因此您的计数器可能会随着时间的推移而出现偏差。

Answer 2

主要问题是未在this内引用each。将选择器更改为$(this)将解决此问题。

注意：您不需要each，因为html()可以使用为每个元素返回字符串的函数：

setInterval(function () {
    $('.updateMinutes').html(function () {
        var minute = $(this).text().match(/\d+/);
        return (parseInt(minute[0]) + 1).toString() + ' minutes';
    });
}, 60000);

JSFIddle：http://jsfiddle.net/TrueBlueAussie/u707zkxo/1/

注意：从间隔开始经过的时间是不可靠的，因此您最好录制＆＃34;现在＆＃34;在呈现页面时，显示从那时起经过的秒数。

Answer 3

如评论中所述，以下代码在jsfiddle上运行良好：

HTML：

<small>posted <span class="updateMinutes">33 seconds</span> ago</small>
<small>posted <span class="updateMinutes">33 seconds</span> ago</small>

JS：

setInterval(function(){
        $('.updateMinutes').each(function(){
            var minute = $(this).text().match(/\d+/);
            $(this).html((parseInt(minute[0]) + 1).toString() + ' minutes');
        });
 }, 1000);

（为演示目的设置第二个间隔）

小提琴在这里：http://jsfiddle.net/e5och57u/

在您的原始帖子中，min [0]是一个错误，应该是分钟[0]，否则它可以正常工作

Answer 4

我刚刚编辑了你的代码以便它正常工作：

$(document).ready(function() {
 function updateMins() {
    $('.updateMinutes').each(function () {
         var minute = $(this).text().match(/\d+/);
         $(this).html((parseInt(minute[0]) + 1).toString() + ' minutes');
    });
 }

 setInterval(updateMins, 60000);
});

Answer 5

我强烈建议您简化流程并使用Moment.js。

你只需要这样做：

moment([2014, 10, 31]).fromNow();    // 2 months ago

jQuery Time Ago

5 个答案: