setTimeout 显示重新加载 div 之前的剩余时间 - AJAX答案

【问题标题】：setTimeout displaying the time left before reloading a div - AJAXsetTimeout 显示重新加载 div 之前的剩余时间 - AJAX
【发布时间】：2014-04-11 05:08:55
【问题描述】：

我正在编写一个脚本以在加载失败后 7 秒内重试 AJAX 脚本。有没有办法在 setTimeout 中显示剩余时间？

这是我的基本脚本：

function update() {
    $.ajax({
        type: 'GET',
        url: 'messageContent.php',
        timeout: 1000,
        success: function (data) {
            $("#chatBox").html(data);
            document.getElementById('messages').scrollTop = document.getElementById('messages').scrollHeight;
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            var d = document.getElementById("loadcon");
            d.innerHTML = '<div class="loadingAnimation"><h3 class="status">Reconnecting...</h3></div>';
            setTimeout (update, 7000);
        }
   });
}

【问题讨论】：

使用 setInteval 并让它运行 7 次迭代或直到时间到期（保存一个日期对象并与当前时间与 7000 比较）可能足够准确。
您必须以更短的时间间隔运行另一个计时器才能进行某种倒计时。您可以保存启动第一个计时器和第二个计时器时的时间，只需计算剩余时间并显示即可。或者，您可以在较短的时间间隔内使用一个重复计时器，并在触发更新之前计算它触发了多少次（例如，每秒更新倒计时并在 7 次更新后，然后调用您的更新）。

标签： javascript ajax settimeout

【解决方案1】：

尝试使用一个函数来做计时器并在你的处理程序上调用它

像这样：

 function startCounter(timeLeft) {
      if (timeLeft > 0) {

        ..display timeLeft

       setTimeout (function() {startCounter(timeLeft-1); }, 1000);
       }
      else{

        ..your function to retry

       }
     }

希望有帮助:)

【讨论】：

它有效，谢谢.. 但我遇到了另一个问题:(如果在完成最后一个计数器之前再次触发 update()，计数器会发疯。仍在理解这个新问题