javascript - 使用 jQuery 自动刷新 div - setTimeout 或其他方法？

Question

如何使用 JavaScript(特别是 jQuery)制作一个自动刷新的 div？

我知道 setTimeout 方法，但这真的是一个好习惯吗？有没有更好的方法？

function update() {
    $.get("response.php", function(data) {
        $("#some_div").html(data);
    });
    window.setTimeout("update();", 10000);
}

Answer 1

另一个修改:

function update() {
  $.get("response.php", function(data) {
    $("#some_div").html(data);
    window.setTimeout(update, 10000);
  });
}

不同之处在于它在 ajax 调用一次后等待 10 秒。所以实际上刷新之间的时间是 10 秒 + ajax 调用的长度。这样做的好处是，如果您的服务器响应时间超过 10 秒，您就不会同时发生两个(最终，很多)AJAX 调用。

此外，如果服务器无法响应，它不会继续尝试。

我过去曾使用类似的方法使用 .ajax 来处理更复杂的行为:

function update() {
  $("#notice_div").html('Loading..'); 
  $.ajax({
    type: 'GET',
    url: 'response.php',
    timeout: 2000,
    success: function(data) {
      $("#some_div").html(data);
      $("#notice_div").html(''); 
      window.setTimeout(update, 10000);
    },
    error: function (XMLHttpRequest, textStatus, errorThrown) {
      $("#notice_div").html('Timeout contacting server..');
      window.setTimeout(update, 60000);
    }
}

这会在加载时显示一条加载消息(将动画 gif 放在那里以实现典型的“web 2.0”风格)。如果服务器超时(在这种情况下需要超过 2 秒)或发生任何其他类型的错误，它会显示错误，并等待 60 秒，然后再次联系服务器。

这在对大量用户进行快速更新时特别有用，在这种情况下，您不希望每个人都突然用无论如何都超时的请求来削弱滞后的服务器。