Question

以下脚本倒计时但在到达结束时间时不会停止计数。当它达到零时，它再次从60:00开始到0（另一个小时）。当我跳过部分

$time = str_replace(' ', 'T', $db[time]);

并且这样做：

var end = new Date('<?=$db[time]?>');

计数器正在停止，但计数器不能仅在Chrome中的IE或Firefox上运行。

任何人都知道如何阻止此计数器：S Thanx！

$db[time] = Timestamp field in the database (2013-10-03 11:32:39)

剧本：

$time = str_replace(' ', 'T', $db[time]);

Java脚本

<script>
var end = new Date('<?=$time?>');
var _second = 1000;
var _minute = _second * 60;
var _hour = _minute * 60;
var _day = _hour * 24;
var timer;

function showRemaining() {
    var now = new Date();
    var distance = end - now;
    if (distance < 0) {

        clearInterval(timer);
        document.getElementById('countdown').innerHTML = 'ITS NOW TIME!</font><BR><BR>';                
        return;
    }
    var days = Math.floor(distance / _day);
    var hours = Math.floor((distance % _day) / _hour);
    var minutes = Math.floor((distance % _hour) / _minute);
    var seconds = Math.floor((distance % _minute) / _second);


    document.getElementById('countdown').innerHTML = '<font color="orange">' + minutes + ':';
    document.getElementById('countdown').innerHTML += '<font color="orange">' + seconds + ' minutes</font>';
}

timer = setInterval(showRemaining, 1000);
 </script>

Answer 1

我建议你使用

而是{p> var countInterval = setInterval(function() { countdown(secondsRemaining); },1000)。

这样您就不必使用Date或Time对象。到达countdown()后，只需在clearInterval(countInterval)和60内计算一次。

Answer 2

我对你的innerHTML用法有点怀疑。这个脚本位于HTML中的哪个位置？我觉得在设置innerHTML之后会重新评估它。您可以通过在console.log("Started!")旁边添加setInterval语句来测试该理论。

另外，请看这里：

document.getElementById('countdown').innerHTML = 'ITS NOW TIME!</font><BR><BR>';

您正在“设置”（替换）元素的innerHTML，因此它将包含：text，然后是close-font标记。这可能会搞砸你的DOM。最后，你不应该在两行中设置innerHTML两次 - 在函数中设置一次，也许基于一个变量。

（澄清一下：使用innerHTML本身并不是最糟糕的事情 - 但是由于格式错误的HTML，或者通过在层次结构中调整太高的元素，它可能会产生意想不到的影响）

Javascript计时器没有停止

2 个答案: