1

我想更新页面上记录 li 或 divs 上显示的时间。我已将创建此记录的时间与每条记录放在一个隐藏字段中。

例子：

# 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'>

我怎样才能每分钟更新那个时间？所以一分钟后第一个 div 应该说 6 分钟前，第二个 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

你可以在 JS 中做到这一点，你需要几个部分：

  1. 确定需要更改的部分并留出创建时间
  2. 一个每分钟更新一次的计时器，你需要php告诉js它有什么时间
  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 回答
2

您可以尝试使用Moment.js它是一个非常轻量级的库，用于与 Javascript 中的时间管理相关的所有内容。API 非常清晰，文档齐全且功能强大。我将它用于我的一个项目，到目前为止我非常满意。

您可以使用时间自动更新处理程序，这正是您想要的，非常容易使用以下示例：

时刻（“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 回答