Как сделать таймер в однотипных елементах с разным временем?

Question

[amikolyk]

Необходимо увеличивать по секундам время внутри тегов span,
value - это количество секунд.
если время(value) привысит час (3600 сек) надпись меняется "Добавлен более часа назад"

На странице может быть сколько угодно подобных елементов:

<div class="add_time_div">
    <span class="add_time" value ='166' >Добавлен 2:46 мин назад</span>
</div>
<div class="add_time_div">
    <span class="add_time" value ='383' >Добавлен 6:23 мин назад</span>
</div>

Answer 1

[olamedia .]

$('.add_time').each(function(){
    var self = $(this);
    var iv = setInterval(function(){
         var v = parseInt(self.attr('value'), 10);
         self.attr('value', v+1); 
         if (v > 3600){
              self.text('Добавлен более часа назад');
              clearInterval(iv);
         }else{
              var m = Math.floor(v / 60);
              var s = v - m*60;
              self.text('Добавлен ' + m + ':' + (s>10?'':'0') + s +' мин назад');
         }
    }, 1000);
});

исправленная версия - чтобы не сбивалось время при долгом просмотре

var start = new Date().getTime();
$('.add_time').each(function(){
    var self = $(this);
    var sv = parseInt(self.attr('value'), 10);
    var iv = setInterval(function(){
         var now = new Date().getTime();
         var v = Math.floor(sv + (now - start) / 1000);
         // self.attr('value', v);
         if (v > 3600){
              self.text('Добавлен более часа назад');
              clearInterval(iv);
         }else{
              var m = Math.floor(v / 60);
              var s = v - m*60;
              self.text('Добавлен ' + m + ':' + (s>10?'':'0') + s +' мин назад');
         }
    }, 1000);
});

Comments

[amikolyk]

Спасибо это то что нужно!!!!

[olamedia .]

amikolyk: немного поправил

Answer 2

[ummahusla]

Советую расмотреть jQuery плагин - Timeage
timeago.yarp.com

Comments

[amikolyk]

Спасибо очень интересный плагин!