¿Cómo devolver una matriz desde la función de éxito jQuery ajax y usarla en un bucle?

Quiero hacer que el tiempo de cada publicación cambie en tiempo real.

Esta es solo la fuente con el tiempo, porque esto es lo importante aquí.

2 min ago 4 min ago 9 min ago 

Y este es el javascript

 setInterval(updateTimestamps,30000); var realTime=; function updateTimestamps(){ $(".timestamp").each(function(i){ var timestamp=$(this).attr("postdate"), postID=$(this).attr("postID"), math=realTime-timestamp; if(math<3600){var dataString='postID='+postID+'&timestamp='+timestamp; $.ajax({ type:"POST", url:"http://site.com/ajax/humanTime.php", data:dataString, cache:false, success:function(html){ $("[postID='"+postID+"']").html(html); } }); } }); } 

En humanTime.php calculo el tiempo:

 $timestamp = $_POST['timestamp']; $now=time(); $diff= $now - $timestamp; and so on.. 

Pero el problema es que hace muchas conexiones, porque se llama a la secuencia de comandos para cada publicación. Y pensé que tal vez puedo hacer 1 conexión, ordenar los datos en una matriz y luego cambiar la hora. Pero nunca trabajé con json y estoy seguro de que si lo que quiero es realmente posible

Haría algo como esto:

 setInterval(updateTimestamps,30000); var ids = new Array(); function updateTimestamps(){ $(".timestamp").each(function(i){ var obj = new Object(); obj.id = $(this).attr("postID"); obj.timestamp = $(this).attr("postdate"); ids.push(obj); } $.post("http://site.com/ajax/humanTime.php", {"time": ids}, function(data) { for (i = 0; i < data.length; i++) { $("#" + data[i].id).html(data[i].content); } }, "json"); } 

EDITAR: Y en humanTime.php:

  

luego devuelve algo como esto:

 [{id:1, content:1 minute ago}, {id:3, content: 5 hours ago}] 

PD: Esta solución es lo que solicitó, pero creo que el enfoque de Bram es mejor.

¿Por qué calcular el lado del servidor del tiempo humano? Puede hacer esos cálculos perfectamente del lado del cliente también.

 setInterval(updateTimestamps,30000); var currentTime=; function updateTimestamps(){ $(".timestamp").each(function(i){ var timestamp=$(this).attr("postdate"); $(this).text(humanTime(currentTime, timestamp)); }); } function humanTime(currentTime, timestamp) { var diff = currentTime - timestamp, minute = 60, hour = minute * 60, day = hour * 24, week = day * 7; if (isNaN(diff) || diff < 0) { return ""; // return blank string if unknown } if (diff < second * 2) { // within 2 seconds return 'right now'; } if (diff < minute) { return Math.floor(diff / second) + 'seconds ago'; } if (diff < minute * 2) { return 'about one minute'; } if (diff < hour) { return Math.floor(diff / minute) + 'minutes ago'; } if (diff < hour * 2) { return 'about an hour ago'; } if (diff < day) { return Math.floor(diff / hour) + 'hours ago'; } if (diff > day && diff < day * 2) { return 'yesterday'; } if (diff < day * 365) { return Math.floor(diff / day) + 'days ago'; } else { return 'more then a year ago'; } } 

Esta función está tomada de: http://www.queness.com/post/8567/create-a-dead-simple-twitter-feed-with-jquery

Y como se dijo: use una etiqueta o la etiqueta HTML5 .

  posted now  

¿Qué hay de procesar el lado del cliente en su intervalo:

el marcado de la muestra podría ser div, span, etc.

 

Esto es compatible con presente y futuro y genérico.

 var time_formats = [ [60, 'just now', 1], [120, '1 minute ago', '1 minute from now'], [3600, 'minutes', 60], [7200, '1 hour ago', '1 hour from now'], [86400, 'hours', 3600], [172800, 'yesterday', 'tomorrow'], [604800, 'days', 86400], [1209600, 'last week', 'next week'], [2419200, 'weeks', 604800], [4838400, 'last month', 'next month'], [29030400, 'months', 2419200], [58060800, 'last year', 'next year'], [2903040000, 'years', 29030400], [5806080000, 'last century', 'next century'], [58060800000, 'centuries', 2903040000] ]; function prettydate(date_str) { var time = ('' + date_str).replace(/-/g, "/").replace(/[TZ]/g, " "); var seconds = (new Date() - new Date(time)) / 1000; var token = 'ago'; var list_choice = 1; if (seconds < 0) { seconds = Math.abs(seconds); token = 'from now'; list_choice = 2; } var i = 0, format; while (format = time_formats[i++]) if (seconds < format[0]) { if (typeof format[2] == 'string') return format[list_choice]; else return Math.floor(seconds / format[2]) + ' ' + format[1] + ' ' + token; } return time; } // these would normally come from your ajax/creation of the element $('.timestamp[postID=6]').data('postdate', '2012-03-20T09:24:17Z'); $('.timestamp[postID=2]').data('postdate', '2012-03-20T10:24:17Z'); $('.timestamp[postID=3]').data('postdate', '2012-03-20T08:24:17Z'); function formatTimes() { $('.timestamp').each(function() { $(this).text(prettydate($(this).data('postdate'))); }); } setTimeout(formatTimes, 30000); 

Ejemplo de trabajo: http://jsfiddle.net/MarkSchultheiss/6HKmS/