javascript计时器减去计数

时间:2016-01-04 17:27:00

标签: javascript

你好我希望当计时器到达截止日期时停止计数......然后它会停止,但是当我刷新它的负数时,就像这样http://prntscr.com/9m17mn

我希望当它达到0时保持这样并且在刷新之后

提前致谢

继承人的代码



<script>
  function getTimeRemaining(endtime){
  var t = Date.parse(endtime) - Date.parse(new Date());
  var seconds = Math.floor( (t/1000) % 60 );
  var minutes = Math.floor( (t/1000/60) % 60 );
  var hours = Math.floor( (t/(1000*60*60)) % 24 );
  var days = Math.floor( t/(1000*60*60*24) );
  return {
    'total': t,
    'days': days,
    'hours': hours,
    'minutes': minutes,
    'seconds': seconds
  };
}

function initializeClock(id, endtime){
  var clock = document.getElementById(id);
  var daysSpan = clock.querySelector('.days');
  var hoursSpan = clock.querySelector('.hours');
  var minutesSpan = clock.querySelector('.minutes');
  var secondsSpan = clock.querySelector('.seconds');

  function updateClock(){
    var t = getTimeRemaining(endtime);

    daysSpan.innerHTML = t.days;
    hoursSpan.innerHTML = ('0' + t.hours).slice(-2);
    minutesSpan.innerHTML = ('0' + t.minutes).slice(-2);
    secondsSpan.innerHTML = ('0' + t.seconds).slice(-2);

    if(t.total<=0){
      clearInterval(timeinterval);
    }
  }

  updateClock();
  var timeinterval = setInterval(updateClock,1000);
}

var deadline = "2016-01-04T18:04:00.000+01:00";
initializeClock('clockdiv', deadline);


</script>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:2)

看起来您正在检查是否应在设置html后停止计时器,这意味着您可能会显示负值:

function updateClock(){
    var t = getTimeRemaining(endtime);
    if(t.total<=0){
      clearInterval(timeinterval);
      daysSpan.innerHTML = '0';
      hoursSpan.innerHTML = '0';
      minutesSpan.innerHTML = '0';
      secondsSpan.innerHTML = '0';
    } else {
      daysSpan.innerHTML = t.days;
      hoursSpan.innerHTML = ('0' + t.hours).slice(-2);
      minutesSpan.innerHTML = ('0' + t.minutes).slice(-2);
      secondsSpan.innerHTML = ('0' + t.seconds).slice(-2);
    }

}

答案 1 :(得分:0)

这样的事情:

<script>
  function getTimeRemaining(endtime){
  var t = Date.parse(endtime) - Date.parse(new Date());
  var seconds = Math.floor( (t/1000) % 60 );
  var minutes = Math.floor( (t/1000/60) % 60 );
  var hours = Math.floor( (t/(1000*60*60)) % 24 );
  var days = Math.floor( t/(1000*60*60*24) );
  return {
    'total': t,
    'days': days,
    'hours': hours,
    'minutes': minutes,
    'seconds': seconds
  };
}

function initializeClock(id, endtime){
  var clock = document.getElementById(id);
  var daysSpan = clock.querySelector('.days');
  var hoursSpan = clock.querySelector('.hours');
  var minutesSpan = clock.querySelector('.minutes');
  var secondsSpan = clock.querySelector('.seconds');

  function updateClock(){
    var t = getTimeRemaining(endtime);
    
    daysSpan.innerHTML = (t.total>0)?t.days:"0";
    hoursSpan.innerHTML = (t.hours>0)?('0' + t.hours).slice(-2):"00";
    minutesSpan.innerHTML = (t.minutes>0)?('0' + t.minutes).slice(-2):"00";
    secondsSpan.innerHTML = (t.seconds>0)?('0' + t.seconds).slice(-2):"00";

    if(t.total<=0){
      clearInterval(timeinterval);
    }
  }

  updateClock();
  var timeinterval = setInterval(updateClock,1000);
}

var deadline = "2016-01-04T18:04:00.000+01:00";
initializeClock('clockdiv', deadline);


</script>