Javascript refresh php page when previous refresh has finished

Question

I am using this code to refresh a PHP page:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">// <![CDATA[
$(document).ready(function() {
$.ajaxSetup({ cache: false }); // This part addresses an IE bug. without it, IE will only load the first number and will never refresh
setInterval(function() {
$('.container').load('integra_data.php');
}, 2000); // the "3000" here refers to the time to refresh the div. it is in milliseconds.
});
// ]]></script>

<div class="container"><h3>Loading Data...</h3></div>

in javascript, rather than refreshing every X Seconds, can i make it refresh once the previous refresh has finished?

Answer 1

使用setTimeout代替setInterval。

Answer 2

$(document).ready(function() {
  $.ajaxSetup({ cache: false }); 
  setTimeout(function() {
    $('.container').load('integra_data.php');
  }, 2000); 
});

$( document ).ready(function(){}) everything inside of this will be ran after load of page has finished. so there should be delay of 2 seconds here..

Answer 3

If I got you right you want to refresh the content of the div in an infinite loop, right? If this is right, you could pass your call to load() as complete callback. You could do somethin like this (recursion):

$(document).ready(function() {
  var loadFunction = function () {
    $('.container').load('integra_data.php', loadFunction);
  }
  $.ajaxSetup({ cache: false }); 
  loadFunction();
});

The loadFunction() will call itself every time the last run has finished. Refer to the docs if you want to know more about the complete callback. If you add a little delay, since it's not always the best idea to make request as fast as possible use the setTimeout() function. You could add it to the complete callback.