Как создать таймер выполнения на основе двух дат в JavaScript - PullRequest
Новая
       16

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

0 голосов
/ 01 февраля 2019

Моя цель - создать индикатор выполнения, который показывает обратный отсчет в секундах между датой Javascript и датой MYSQL.Пока у меня есть даты, и я могу вычесть их, но я не могу получить значение, которое работает в секундах для индикатора выполнения.вот мой кодДата создания - дата MYSQL.

JAVASCRIPT 

$(document).ready(function(){
var deadline= new Date(Date.parse("<? echo $creation_date; ?>"));
var x = setInterval(function() {

var now = Date.now();
var timeleft = deadline - now;
if (timeleft < 0) {
      clearInterval(x);
      timeleft  = 0;
}, 1000);

// draw the bar
function progress(timeleft, timetotal, $element) {
    var progressBarWidth = timeleft * $element.width() / timetotal;
    $element.find('div').animate({ width: progressBarWidth }, timeleft == timetotal ? 0 : 1000, 'linear');
    if(timeleft > 0) {
        setTimeout(function() {
            progress(timeleft - 1, timetotal, $element);
        }, 1000);
    }
};

// 86400 is 24 hours.
progress(timeleft, 86400, $('#timerBar'));

HTML 

<div id="timerBar">
    <div>Time Left</div>
  </div>

CSS 

#timerBar {
 width: 90%;
 margin: 10px auto;
 height: 30px;
 background-color: #efd0d0;
}

#timerBar div {
  height: 100%;
  text-align: right;
  padding: 0 30px;
  line-height: 22px; 
  width: 0;
  background-color: #d05656;
box-sizing: border-box;
}
...