如何定期解雇AJAX请求?

时间:2011-02-19 18:04:18

标签: jquery ajax

<meta http-equiv="Refresh" Content="5">

此脚本每5秒后重新加载或刷新页面。但我想用jQuery和AJAX调用来做。可能吗?

4 个答案:

答案 0 :(得分:264)

正如其他人指出的那样,setInterval和setTimeout会起作用。我想强调一下我从保罗爱尔兰的优秀视频中学到的更先进的技术:http://paulirish.com/2010/10-things-i-learned-from-the-jquery-source/

对于可能最终花费的时间超过重复间隔的周期性任务(如慢速连接上的HTTP请求),最好不要使用setInterval()。如果第一个请求尚未完成并且您启动另一个请求,则最终可能会出现多个请求消耗共享资源并相互挨饿的情况。您可以通过等待安排下一个请求直到最后一个请求完成来避免此问题:

// Use a named immediately-invoked function expression.
(function worker() {
  $.get('ajax/test.html', function(data) {
    // Now that we've completed the request schedule the next one.
    $('.result').html(data);
    setTimeout(worker, 5000);
  });
})();

为简单起见,我使用成功回调进行调度。这样做的缺点是一个失败的请求将停止更新。为避免这种情况,您可以使用完整的回调:

(function worker() {
  $.ajax({
    url: 'ajax/test.html', 
    success: function(data) {
      $('.result').html(data);
    },
    complete: function() {
      // Schedule the next request when the current one's complete
      setTimeout(worker, 5000);
    }
  });
})();

答案 1 :(得分:30)

是的,您可以使用JavaScript setTimeout()方法或setInterval()方法来调用您要运行的代码。以下是使用setTimeout的方法:

function executeQuery() {
  $.ajax({
    url: 'url/path/here',
    success: function(data) {
      // do something with the return value here if you like
    }
  });
  setTimeout(executeQuery, 5000); // you could choose not to continue on failure...
}

$(document).ready(function() {
  // run the first time; all subsequent calls will take care of themselves
  setTimeout(executeQuery, 5000);
});

答案 2 :(得分:4)

您可以使用setTimeoutsetInterval

区别在于 - setTimeout只触发一次你的函数,然后你必须再次设置它。 setInterval会一次又一次地触发表达式,除非你告诉它停止

答案 3 :(得分:0)

我尝试了以下代码,

    function executeQuery() {
  $.ajax({
    url: 'url/path/here',
    success: function(data) {
      // do something with the return value here if you like
    }
  });
  setTimeout(executeQuery, 5000); // you could choose not to continue on failure...
}

$(document).ready(function() {
  // run the first time; all subsequent calls will take care of themselves
  setTimeout(executeQuery, 5000);
});

在指定的时间间隔内,此操作无法正常工作,页面未完全加载,并且连续调用了该函数。 最好在下面的单独函数中在setTimeout(executeQuery, 5000);外部调用executeQuery()

function executeQuery() {
  $.ajax({
    url: 'url/path/here',
    success: function(data) {
      // do something with the return value here if you like
    }
  });
  updateCall();
}

function updateCall(){
setTimeout(function(){executeQuery()}, 5000);
}

$(document).ready(function() {
  executeQuery();
});

这完全符合预期。