如何使发布日期同步?

Let say i have 15 or more posts in one page. The code inside the while loop look like this

假设我在一页中有15篇或更多的文章。while循环中的代码看起来是这样的

 <div class="post" id="<?php echo $postID?>">

    <h1><?php echo $title;?></h1>

    <div class="postmeta"> 
posted by <?php echo $author;?> , <?php echo timeAgo($postDate);?></div>
    </div>

this is just an a example ! So timeAgo() function convert the unix timestamp 1329569847 to human time 11 mins ago. And how to make it synchronize in real time with ajax I mean after 5 mins to change to 16 mins ago,after 4 mins to change to 20 mins ago and that to effect all posts.

这只是一个例子!因此timeAgo()函数将unix时间戳1329569847转换为11分钟前的人工时间。如何使它与ajax实时同步，我的意思是5分钟后将其更改为16分钟前，4分钟后将其更改为20分钟前，这将影响所有的贴子。

So i managed to make it work thanks to chenio and TheShellfishMeme (beer).

所以多亏了chenio和the hellfishmeme(啤酒)，我才让它成功。

And this is the code that do the magic

这就是神奇的代码

<span class="timestamp" id="5" postdate="1329576793"></span><br/>

<span class="timestamp" id="8" postdate="1329576795"></span><br/>


<script>

updateTimestamps();
setInterval(updateTimestamps, 60000);

function updateTimestamps(){
    $(".timestamp").each(function(i){

        var timestamp = $(this).attr("postdate");
var postID = $(this).attr("id");

$.ajax({
type: "POST",
url: "myURL",
data: "postID="+ postID +'&timestamp=' + timestamp, 
cache: false,
success: function(html){

$(".timestamp#"+postID).html(html);

}
});




    });
}
</script>

2 个解决方案

#1

I'd use data attributes like here http://jsfiddle.net/rXFnn/ to add the unix timestamp to a span inside the div which is meant to contain the 'time ago' string. Then you port your timeAgo logic over to javascript and update it every minute using setInterval.

我将使用http://jsfiddle.net/rXFnn/这样的数据属性，将unix时间戳添加到div中的span中，该span将包含“time ago”字符串。然后将timeAgo逻辑放到javascript上，并使用setInterval每分钟更新一次。

No need to do AJAX for something that simple, but note that the example below uses jQuery.

不需要为这么简单的事情做AJAX，但是请注意下面的示例使用了jQuery。

For completeness, here is the code again:

为了完整起见，这里是代码:

<div class="postmeta"> 
    posted by Foo , <span class="timestamp" data-timestamp="1329573254200"></span> ago
</div>

<script>
updateTimestamps();
setInterval(updateTimestamps, 60000);

function updateTimestamps(){
    $(".timestamp").each(function(i){
        var timestamp = $(this).data('timestamp');

        // Put your time ago logic here
        var timeAgo = timestamp;
        $(this).text(timeAgo);
    });
}
</script>

#2

With jquery is a good form to do it. This is a example:

使用jquery是一种很好的方式。这是一个例子:

      <script src=jquery.js"></script>
         <script>

     <script>

    var auto_refresh = setInterval(
    function()
    {
// here put a url to a script to calculate time posted ago
    $('#someid').load('someurl');
    }, 60000);
    </script>
   <div class="post" id="<?php echo $postID?>">

    <h1><?php echo $title;?></h1>

    <div class="postmeta" id='someid'> 
posted by <?php echo $author;?> , <?php echo timeAgo($postDate);?></div>
    </div>

Other form is:

其他形式是:

.....  continue
$.ajax({
 // here put a url to a script to calculate time posted ago 
  url: 'url',
  success: function(data) {
    $('#someid').html(data);

  }
}); 
......

http://api.jquery.com/jQuery.ajax and http://designgala.com/how-to-refresh-div-using-jquery/

http://api.jquery.com/jQuery.ajax和http://designgala.com/how-to-refresh-div-using-jquery/

i hope this can help you

我希望这能对你有所帮助

#1