每 30 秒运行一次 ajax 并显示倒数计时器答案

【问题标题】：Run ajax every 30 seconds and show a countdown timer每 30 秒运行一次 ajax 并显示倒数计时器
【发布时间】：2014-01-09 14:14:48
【问题描述】：

我有一个希望每 30 秒运行一次的函数。这很好用

$(document).ready(function(){
    setInterval(function() {
        jQuery.ajax({
            type: "GET",
            url: "loaddata.php",
            dataType:"json",
            success:function(response){
                if (response) {
                    // Process
                }
                else {
                    // Process 
                }
            }

        });
    }, 30000);
});

但我想弄清楚如何显示与 setInterval 内联的倒数计时器。换句话说，它应该显示在 ajax 运行之前还剩多少秒，一旦函数运行，它应该重置计时器并再次从 30 秒开始倒计时。这个过程会不断重复。我找到了几个倒数计时器的例子，但我不知道如何将它与 ajax 请求同步并重置它。

非常感谢任何帮助！

【问题讨论】：

只是对@dhsto 解决方案的补充，但没有（全局）var 和setIntveral()。相反，我使用了一个命名函数和setTimeout() - fiddle

标签： javascript php ajax countdowntimer

【解决方案1】：

只需每秒运行一个函数，并拥有一个倒数到 0 的计数器。当它达到 0 时，运行您的 ajax 代码并重置计数器。像这样：

var count = 30;
setInterval(function() {
    count--;

    // update timer here

    if (count === 0) {
        count = 30;
        // ajax code here
    }
}, 1000);

将计时器中的初始显示值设置为 30。然后这将显示 29、28、27、...、2、1、0、29、28 等。

【讨论】：