Использование JQuery Timeago

Question

У меня есть тег <abbr> с классом "timeago" в моем HTML.Когда я устанавливаю это значение при загрузке страницы, затем вызываю jQuery("abbr.timeago").timeago(); для функции готовности документа, она работает.

Мой вопрос такой: что если я динамически изменю заголовок abbr.timeago из какой-либо функции javascript, как я могу сделать timeagoплагин, чтобы творить чудеса с обновленным элементом abrr.timeago?

Какую функцию я должен вызывать?Должен ли я удалить jQuery("abbr.timeago").timeago(); из функции готовности документа или оставить ее?спасибо

РЕДАКТИРОВАТЬ ВОПРОС:

@ squiddy пример работает, обновляет время только один раз и просто остается неизменным.Например, если я добавлю timeago к текущему времени ... то оно просто не изменится?

ОБНОВЛЕНИЕ BOUNTY:

Пожалуйста, не обращайте внимания на предыдущеевопрос .На моем веб-сайте есть ссылка, по ее нажатию вызывается функция 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 секунд, для вызовафункция времени, но всегда одинаковые результаты

Answer 1

ОБНОВЛЕНИЕ 2: Тот же трюк работает здесь. Элемент column был ранее преобразован 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

Начиная с версии 1.1.0, jquery.timeago.js теперь предоставляет действие update, которое можно использовать:

От: https://github.com/rmm5t/jquery-timeago/pull/115

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

Answer 3

не добавляйте ни javascript, ни jquery-код, кроме этого;

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

и затем добавьте «Z» (или включая T). Для получения дополнительной информации перейдите по этой ссылке

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

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

Answer 4

Если вы хотите обновить элемент timeago с новой датой. Самый простой способ сделать это -

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

Это работает как шарм. Я не понимаю, почему это нигде не задокументировано. Вы можете найти эту функцию, взглянув на код JavaScript времени.

Answer 5

Я не смог заставить его работать после изменения значения в атрибуте title, но timeago поддерживает прямое приближение, подобное этому:

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"));