jQuery Ajax with pause - EXAMPLE

by pleinx

HTML

<div class="log"></div>

JavaScript

var $log = $('.log');

var fakeProducts = ['p1','p2','p3','p4','p5','p6','p7','p8','p9','p10'];
var counter = 0;
var queue = 0;
var callsEachRound = 3;

// start
doAction();
var interval = setInterval(function() {
	doAction();
}, 4000);

// do 3 ajax calls
function doAction() {
  counter = 0;
  var limit = (fakeProducts.length - queue) >= callsEachRound ? callsEachRound : (fakeProducts.length - queue);
	for(; counter < limit ; counter++) {
  	var def = doAjax(queue);
    queue++;
    
    if(queue >= fakeProducts.length) {
      $.when(def).done(function() {
      	$log.append('All done!!!');
      });
      
      clearInterval(interval);
      break;
    }      
  }
}

// exec ajax
function doAjax(id) {
  return $.get('/echo/js/?js=Hello', {'productId': id}, function() {
    $log.append(fakeProducts[id] + '<br>');
  });
}