2

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

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

并这样做：

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

计数器正确停止，但计数器仅在 Chrome 中无法在 IE 或 Firefox 上工作。

任何人都知道如何阻止这个计数器：S 谢谢！

$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>
4

2 回答 2

1

我建议你使用

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

这样您就不必玩弄 Date 或 Time 对象了。只要在里面数一数countdown()，clearInterval(countInterval)一旦你到达60。

于 2013-10-07T13:58:15.937 回答
1

我对您的 innerHTML 用法有点怀疑。这个脚本在 HTML 中的什么位置？我有一种感觉，在设置 innerHTML 后它正在被重新评估。console.log("Started!")您可以通过在旁边放置一个语句来测试该理论setInterval。

另外，看这里：

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

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

（澄清一下：单独使用innerHTML并不是最糟糕的事情——但是对于格式错误的HTML，或者通过将层次结构中的元素调整得太高，它可能会产生意想不到的效果）

于 2013-10-07T14:11:36.427 回答