Estoy haciendo un contador de JavaScript que cuenta' segundos atrás '. Tengo mi tiempo en un objeto de tiempo JS, y encontré un fragmento de función de "diferencia de tiempo" aquí en el desbordamiento de la pila, pero aparece "hace 2 horas". ¿Cómo puedo hacer que muestre "5 horas, 10 minutos y 37 segundos atrás"?Javascript fuzzy time (por ejemplo, '10 minutos atrás ') en segundos exactos
Aquí es lo que estoy trabajando con:
Esta función convierte la hora actual y la fecha y hora de algo en "Hace 20 segundos" en lugar de una fecha críptica:
function timeDifference(current, previous) {
var msPerMinute = 60 * 1000;
var msPerHour = msPerMinute * 60;
var msPerDay = msPerHour * 24;
var msPerMonth = msPerDay * 30;
var msPerYear = msPerDay * 365;
var elapsed = current - previous;
if (elapsed < msPerMinute) {
return Math.round(elapsed/1000) + ' seconds ago';
} else if (elapsed < msPerHour) {
return Math.round(elapsed/msPerMinute) + ' minutes ago';
} else if (elapsed < msPerDay) {
return Math.round(elapsed/msPerHour) + ' hours ago';
} else if (elapsed < msPerMonth) {
return 'approximately ' + Math.round(elapsed/msPerDay) + ' days ago';
} else if (elapsed < msPerYear) {
return 'approximately ' + Math.round(elapsed/msPerMonth) + ' months ago';
} else {
return 'approximately ' + Math.round(elapsed/msPerYear) + ' years ago';
}
}
Y aquí es lo que Estoy usando para "contar" el tiempo cada segundo. Me gustaría que decir "5 horas, 3 minutos, 10 segundos" y luego 1 segundo más tarde, "5 horas, 3 minutos, 11 segundos atrás"
var newTime = new Date(data.popular[i].timestamp*1000)
var relTime = timeDifference(new Date(),newTime)
setInterval(function(){
var theTimeEl = $('.timestamp-large').filter(function(){
return $(this).html() == relTime
});
newTime.setSeconds(newTime.getSeconds() + 1);
var relTime = timeDifference(new Date(), newTime);
$(theTimeEl).html(relTime);
console.log(relTime)
}, 1000)
El Newtime variable es el tiempo en el UTC formato de fecha de javascript. relTime es eso en formato "segundos atrás". El intervalo recorre un grupo de elementos de marca de tiempo y selecciona el correcto para cada marca de tiempo. Luego agrega un segundo al tiempo, lo convierte nuevamente en "tiempo difuso" (segundos atrás), reemplaza el html con el nuevo horario y lo registra en la consola.
¿Cómo cambio "5 horas atrás" en "5 horas, 37 minutos, hace 10 segundos"? La función de diferencia de tiempo necesita ser modificada.
¿Por qué estás volviendo a declarar 'var relTime' dentro de setInterval? – ErikE
P.S. Utilizaría un método muy diferente para encontrar el elemento html correcto. Tiene que haber una etiqueta de datos [algo] que pueda agregar a cada uno que pueda correlacionar la marca de tiempo apropiada con el html correcto. – ErikE
@ErikE Tengo que declarar relTime nuevamente o de lo contrario siempre tendrá el valor inicial. ¿Y cómo es mejor utilizar .attr ('datasomething') que .html()? – alt