1

ページのレコードliまたはdivに表示される時間を更新したい。このレコードの作成時間を、各レコードの隠しフィールドに入れました。

例：

# Hi what are you doing? 
  5 minute ago.  <hidden id='1' value='1345888475'>

# Akon song is good 
  10 minute ago  <hidden id='2' value='1345888855'>

# I love the way you lie
  15 minute ago <hidden id='3' value='1345889995'>

その時間を毎分更新するにはどうすればよいですか？したがって、1分後、最初のdivは6分前と言い、2番目のdivは11分前と言うはずですか？

JSを使用してそれは可能ですか？私はこれのためにphpに行きたくありません。JSを使用するだけです。DBの時間は次のように保存されますstrtotime(date("Y-m-d H:i:s"))

ありがとうございました！

4

3 に答える 3

5

個人的には次のようなHTMLを使用します。

<span data-time="1345888475">Loading...</span>

次に、スクリプトに次のようなものがあります。

(function() {
  var timetostring(secs) {
      if( secs < 60) return secs+" seconds ago";
      secs = Math.floor(secs/60);
      if( secs < 60) return secs+" minutes ago";
      secs = Math.floor(secs/60);
      if( secs < 24) return secs+" hours ago";
      secs = Math.floor(secs/24);
      return secs+" days"; // you can of course continue
  };
  (function() {
      var qsa = document.querySelectorAll("[data-time]"), l = qsa.length, i, t;
      for(i=0; i<l; i++) {
          t = new Date().getTime()/1000-qsa[i].getAttribute("data-time");
          qsa[i].firstChild.nodeValue = timetostring(t);
      }
      setTimeout(arguments.callee,15000);
  });
})();
于 2012-12-21T18:20:27.947 に答える
2

Moment.jsJavascriptの時間管理に関連するすべてのもののための素晴らしくて非常に軽量なライブラリである使用を試みることができます。APIは非常に明確で、十分に文書化されており、強力です。私は自分のプロジェクトの1つにそれを使用しており、これまでのところ非常に満足しています。

以下の例のようなもので、非常に簡単に、まさにあなたが望むものである時間自動更新ハンドラーを使用することができます：

moment（ "20111031"、 "YYYYMMDD"）。fromNow（）; // 一年前

moment（ "20120620"、 "YYYYMMDD"）。fromNow（）; //6か月前

moment（）。startOf（'day'）。fromNow（）; //19時間前

moment（）。endOf（'day'）。fromNow（）; //5時間で

setInterval時間を更新するために、ハンドラー内でこれらの関数を呼び出すことができます。

于 2012-12-21T18:16:34.867 に答える
2

あなたはJSでこれを行うことができます、あなたはいくつかの部分が必要です：

  1. 変更が必要な部品を特定し、それらの作成時間を与えます
  2. 毎分時間を更新するタイマー。jsに何時かを伝えるためにphpが必要です。
  3. ページの読み込み時に時間を読み取り可能なテキストに変換するスクリプト。

http://jsfiddle.net/gunderson/srKET/

    <div class="message" id='1' data-timestamp='1345888475'>
    <span class="content"># Hi what are you doing? </span><br/>
    <span class="timeAgo">5 mint ago. </span>
    </div>

    var currentTime = <?=time()?>;
    var timestampHandler = setInterval(onUpdateTimestamp, 60 * 1000); //one minute
    function onUpdateTimestamp(){
         currentTime += 60;
         $(".message").each(updateTimeAgo);
    }

    function updateTimeAgo(){
        var $el = $(this);
        var postTime = parseInt($el.data('timestamp'));
        var newTimeAgo = (currentTime - postTime) / 60; //minutes
        $el.find(".timeAgo").html(newTimeAgo + " mint ago.")
    }
于 2012-12-21T18:27:53.677 に答える