7

<abbr>HTML にクラス「timeago」のタグがあります。ページの読み込み時に値を設定してからjQuery("abbr.timeago").timeago();、ドキュメントの準備ができている関数を呼び出すと、機能します。

私の質問は、abbr.timeago のタイトルを JavaScript 関数から動的に変更した場合、更新された abrr.timeago 要素に対して timeago プラグインを作成するにはどうすればよいですか?

どの関数を呼び出す必要がありますか? ドキュメント準備機能から削除するjQuery("abbr.timeago").timeago();か、そのままにしておく必要がありますか? ありがとうございました

質問を編集:

@squiddy の例は機能し、時刻を 1 回だけ更新し、変更されないままです。たとえば、 timeago を現在の時刻に置くと..それは変わらないように立つだけですか?

報奨金の更新:

前の質問は無視してください。私のWebサイトには、クリックすると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")) を配置しましたが、実際にはそうですが、 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関数を呼び出しますが、常に同じ結果になります

4

5 に答える 5

13

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

これがあなたが必要としていたものであることを願っています!

于 2011-02-04T14:48:49.010 に答える
1

これ以外の 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

于 2013-07-28T13:48:23.343 に答える
0

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"));
于 2011-02-04T14:54:07.150 に答える