计数器不活

Question

我的以下脚本有效：但有一个问题：它不会倒计时。它提供了正确的输出（现在到日期的时间），但不会自动更新。

现在有人怎么了？

最主要的是这个倒数计时器适用于服务器时间（这就是为什么开机而.php）。

        <script>
var end = new Date('10/7/2013 7:0 PM');
var _second = 1000;
var _minute = _second * 60;
var _hour = _minute * 60;
var _day = _hour * 24;
var timer;
var now;
function startShowRemaining(strnow) {
now = new Date(strnow);
showRemaining();
}
function showRemaining() {
//var now = new Date(strnow);
    var distance = end - now;
    if (distance < 0) {
        clearInterval(timer);
        document.getElementById('countdown').innerHTML = 'EXPIRED!';
        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 = days + 'days ';
    document.getElementById('countdown').innerHTML += hours + 'hrs ';
    document.getElementById('countdown').innerHTML += minutes + 'mins ';
    document.getElementById('countdown').innerHTML += seconds + 'secs';
}
timer = setInterval(showRemaining, 1000);
function postRequest(strURL) {
var xmlHttp;
if (window.XMLHttpRequest) { // Mozilla, Safari, ...
    var xmlHttp = new XMLHttpRequest();
} else if (window.ActiveXObject) { // IE
    var xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlHttp.open('POST', strURL, true);
xmlHttp.setRequestHeader('Content-Type', 
   'application/x-www-form-urlencoded');
xmlHttp.onreadystatechange = function() {
    if (xmlHttp.readyState == 4) {
        startShowRemaining(xmlHttp.responseText);
    }
}
xmlHttp.send(strURL); }
postRequest('time.php');      
</script>
<div id="countdown"></div>

时间。.PHP：

print date("m/d/Y, G:i:s");

Answer 1

问题是你只轮询一次服务器时间。你一次又一次地调用showRemaining，但now时间永远不会改变，因此输出永远不会改变。

如果需要使用服务器时间，则需要在每次调用showRemaining时发送postRequest发送的请求，并将其用于now：

这篇文章的一些被删除了，因为它是错误的

你可以在这个jsfiddle中找到一个例子，我用存根替换了postRequest的内容，以使用客户端时间而不是进行Ajax调用（因为我无法访问你的time.php）。

当然，像这样的重复服务器请求效率很低，因此您确实应该考虑使用客户端的时钟。您也可以考虑使用服务器时间一次，然后使用 Javascript 时钟来增加该时间。