Question

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

任何人都错了？

主要的是这个倒数计时器与服务器时间一起工作（这就是为什么帖子和time.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>

TIME.PHP：

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

Answer 1

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

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

部分帖子因错误而被删除

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

当然，像这样重复的服务器请求是非常低效的，所以你真的应该考虑使用客户端的时钟。您还可以考虑使用服务器时间一次，然后使用Javascript时钟添加到该时间。

反不住

1 个答案: