Создать таймер инсенмента в Javascript

0

проблема

Я хочу, чтобы таймер принимал секунды, минуты, часы, дни и начинал увеличивать оттуда, скажите, что пользователь открывает страницу, где время, полученное от сервера, составляет 2 hours 30 minutes 05 seconds, теперь таймер javascript начнет увеличиваться от этого поэтому он 02:30:05 затем 02:30:06.. 02:31:00 и т.д., как только секунды достигают 60 минут, увеличивается

Что я пробовал

Я реализовал то же самое using moment.js

var duration = moment.duration({
    'seconds': 30,
        'hour': 2,
        'minutes': 10
});
var interval = 1;
setInterval(function () {
    duration = moment.duration(duration.asSeconds() + interval, 'seconds');
    //.asSeconds() 
    $('.countdown').text(Math.round(duration.asHours()) + 'h:' + Math.round(duration.asMinutes()) + 'm:' + Math.round(duration.asSeconds()) + 's'); //.seconds() 
    $('.countdown1').text(duration.days() + 'd:' + duration.hours() + 'h:' + duration.minutes() + 'm:' + duration.seconds() + 's');

}, 1000);

JSfiddle

требование

Я хочу знать, как я могу реализовать его с помощью javascript/jquery, если возможно, иначе я буду использовать moment.js one, я посмотрел вокруг, но у всех есть таймер обратного отсчета, созданный с даты, поэтому на вход будут seconds, minutes, hours, days и счетчик будет начинаться оттуда постепенно

  • 0
    Что не так с примером moment.js?
  • 0
    Ничего плохого, но я хочу по возможности реализовать его с помощью javascript / jquery, чтобы мне не пришлось загружать дополнительную библиотеку
Показать ещё 4 комментария
Теги:
timer
momentjs

1 ответ

0
Лучший ответ

Вы можете попробовать что-то простое:

var input = {year: 0, month: 0, day: 0, hours: 2, minutes: 10, seconds: 30};

var timestamp = new Date(input.year, input.month, input.day, 
                         input.hours, input.minutes, input.seconds);

var interval = 1;

setInterval(function () {
    timestamp = new Date(timestamp.getTime() + interval * 1000);     
    $('.countdown2').text(timestamp.getDay()+'d:'+timestamp.getHours()+'h:'+
       timestamp.getMinutes()+'m:'+timestamp.getSeconds()+'s');
}, Math.abs(interval) * 1000);

Каждый интервал вы увеличиваете значение времени объекта Date, а затем читаете часы/минуты/секунды и позволяете исходной версии даты беспокоиться о преобразовании из необработанных секунд. Интервал может быть положительным или отрицательным и таким большим, как вам нравится.

демонстрация

  • 0
    Спасибо за ответ, он работает в соответствии с моим требованием :), внедрит его в мою работу и сообщит вам. ура
  • 0
    Добавили скрипку только для демонстрации. Спасибо его работает отлично

Ещё вопросы

Сообщество Overcoder
Наверх
Меню