Question

我的HTML中有一个<abbr>标记，其中包含“timeago”类。当我在页面加载时设置它值，然后在文档就绪函数上调用它jQuery("abbr.timeago").timeago();。

我的问题是，如果我从一些javascript函数中动态更改abbr.timeago标题怎么办？如何让timeago插件在更新的abrr.timeago元素上做出魔术呢？

我应该拨打哪个功能？我应该从文档就绪功能中删除jQuery("abbr.timeago").timeago();还是保留它？谢谢

编辑问题：

@squiddy示例有效，只更新一次时间，它只是保持不变。例如，如果我将timeago放到当前时间......那么它就像它没有改变那样？

BOUNTY UPDATE：

请忽略上一个问题。在我的网站上有一个链接，它的click getJSON函数被调用，它从服务器获取一些信息到表中。

每行代表来自服务器的反馈。这是我的getJSON伪代码：

            $.getJSON("feedback/" + feedbackId, function(data) {
            var column ... declared variable in which column selector
        .... some logic that populates table(irrelevant)
            //Store last checked time in title
        column.attr("title", iso8601(new Date()));
            //invoke timeago on this title
        column.html(jQuery.timeago(iso8601(new Date())));
            ....iso8601 is date format function
    });

因此，我从服务器获得的每个反馈都会调用此getJSON（n次）。当json完成时，表中的相应列将填充上次更新的时间。

但似乎timeago没有读取更改的标题值，它无法识别更新的DOM。我为服务器的每个反馈设置了一个console.log（element.attr（“title”）），用于调试目的，看看我是否将title属性设置为当前时间，确实确实如此，但是timeago获取了最初加载的标题值。

我该怎么做我也试过这个版本：

$.getJSON("feedback/" + feedbackId, function(data) {
                var column ... declared variable in which column selector
            .... some logic that populates table(irrelevant)
                //Store last checked time in title
            column.attr("title", iso8601(new Date()));
                //invoke timeago on this title

                $(column).livequery(function() {
                $(this).timeago(iso8601(new Date()));
                console.log($(this).attr("title"));
            });  
        });

我花了几个小时尝试了几种可能的解决方案..就像每隔n秒调用一次，调用timeago函数但总是相同的结果

Answer 1

更新2：同样的技巧在这里工作。元素column之前由timeago转换过一次，当发生这种情况时，timeago在元素上放置了一个'timeago'数据字段。当这个数据字段存在时，timeago不会打扰它，所以你必须清除它。代码看起来像这样：

$.getJSON("feedback/" + feedbackId, function(data) {
    var column 
    // ... declared variable in which column selector
    // ... some logic that populates table(irrelevant)
    // Store last checked time in title
    column.attr("title", iso8601(new Date()));
    // invoke timeago on this title
    column.data("timeago",null).timeago();
    // ... iso8601 is date format function
});

更新：更正，测试，诀窍是，timeago插件标记已经转动的元素，并且不要让它们再次转动，除非标记被清除

当您更改abbr.timeago中的值时，您应该再次对该元素运行timeago（）函数。我会为此推荐一些功能：

$.fn.changeTimeago = function(isotime) {
    return $(this).attr("title",isotime).data("timeago",null).timeago();
}

// usage:
$("abbr.timeago").changeTimeago("2004-07-17T09:24:17Z");

希望这就是你所需要的！

Answer 2

除此之外，不要添加任何javascript或jquery代码;

$('.timeago').timeago();

然后添加'Z'（或包括T）。有关更多信息，请转到此link

<abbr class='timeago' title='2011-09-09 10:10:10Z'></abbr>

http://en.wikipedia.org/wiki/ISO_8601#Combined_date_and_time_representations

Answer 3

从v1.1.0开始，jquery.timeago.js现在提供了一个可以使用的update动作：

来自：https://github.com/rmm5t/jquery-timeago/pull/115

$(column).livequery(function() {
  $(this).timeago('update', iso8601(new Date()));
});

Answer 4

在更改title属性中的值后，我无法使其工作，但是timeago支持这样的直接approch：

jQuery.timeago(new Date());             //=> "less than a minute ago"
jQuery.timeago("2008-07-17");           //=> "2 years ago"
jQuery.timeago(jQuery("abbr#some_id")); //=> "2 years ago" [title="2008-07-20"]

因此，在更改元素时，请自行更新html：

jQuery("abbr.timeago").html(jQuery.timeago("2010-07-17T09:24:17Z"));

Answer 5

如果您希望使用新日期更新timeago元素。最简单的方法如下 -

$('abbr.timeago').timeago('update',(new Date()).toISOString());

它就像一个魅力。我不明白为什么在任何地方都没有记录。您可以通过查看timeago javascript代码找到此功能。

jQuery timeago用法

5 个答案: