时间倒计时在Chrome中工作但不是safari

时间:2016-06-14 09:43:33

标签: javascript safari

我有一个倒计时器的顶杆。它在chrome和firefox上工作得很好但我刚刚意识到它似乎不适用于safari。 这是代码:

<div class="deadline_Container">
  <div id="clockdiv">
    <span class="deadline_Text">You only have </span>
  <div><span class="days"></span><span  class="smalltext">Days</span></div>
  <div><span class="hours"></span><span  class="smalltext">Hours</span></div>
  <div><span class="minutes"></span><span  class="smalltext">Minutes</span>
</div>
<div class="clockLast"><span class="seconds"></span><span  class="smalltext">Seconds</span></div>
 <span class="deadline_Text2">left to get free delivery!</span></div>
</div>

<script type="text/javascript">
var deadline = 'Jun 15 2016 23:59:59 GMT';
function time_remaining(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 run_clock(id,endtime) {
  var clock = document.getElementById(id);
  var days_span = clock.querySelector('.days');
  var hours_span = clock.querySelector('.hours');
  var minutes_span = clock.querySelector('.minutes');
  var seconds_span = clock.querySelector('.seconds');

  function update_clock(){
    var t = time_remaining(endtime);
    days_span.innerHTML = t.days;
    hours_span.innerHTML = ('0' + t.hours).slice(-2);
    minutes_span.innerHTML = ('0' + t.minutes).slice(-2);
    seconds_span.innerHTML = ('0' + t.seconds).slice(-2);
    if(t.total<=0) {
      clearInterval(timeinterval);
    }
  }

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

run_clock('clockdiv',deadline);
</script>

现在在徒步旅行中,而不是几天,几小时,几分钟等等,它说“NaN”是一个“一个”。所以我认为它与时间格式有关?

我已经尝试过设置这样的时间:

 var deadline = '2016-06-15T23:59:59 GMT +0100';

但是这没用。有什么想法吗?

1 个答案:

答案 0 :(得分:0)

您的基本问题是使用Date构造函数解析字符串。不要那样做。使用Date构造函数解析字符串(或Date.parse,它们等同于解析)强烈建议不要使用它,因为它在很大程度上依赖于实现。

因此,您会在不同的浏览器中看到不同的结果。变化:

var deadline = 'Jun 15 2016 23:59:59 GMT';

var deadline = new Date(Date.UTC(2016, 5, 15, 23, 59, 59));

var t = Date.parse(endtime) - Date.parse(new Date());

var t = endtime - new Date();

请注意Date.parse(new Date())将创建一个新Date,使用依赖于实现的 Date.prototype.toString 将其转换为字符串,将其解析回Date,然后获取时间值。