var ajaxManager = (function() {
var requests = [];
return {
addReq: function(opt) {
requests.push(opt);
},
removeReq: function(opt) {
if( $.inArray(opt, requests) > -1 )
requests.splice($.inArray(opt, requests), 1);
},
run: function() {
var self = this,
oriSuc;
if( requests.length ) {
oriSuc = requests[0].complete;
requests[0].complete = function() {
if( typeof(oriSuc) === 'function' ) oriSuc();
requests.shift();
self.run.apply(self, []);
};
$.ajax(requests[0]);
} else {
self.tid = setTimeout(function() {
self.run.apply(self, []);
}, 1000);
}
},
stop: function() {
requests = [];
clearTimeout(this.tid);
}
};
}());
reference: https://stackoverflow.com/questions/4785724/queue-ajax-requests-using-jquery-queue
$(function(){
ajaxManager.run();
$("div").each(function(){
var obj = $(this);
var jqxhr = $.getJSON( "posts/"+$(this).text(), function(data) {
ajaxManager.addReq({
type: 'POST',
url: 'https://abc/posts/',
beforeSend: function (xhr) {
xhr.setRequestHeader('Authorization', 'Bearer <?php echo $_GET['access_token']; ?>');
},
data: JSON.stringify(data),
dataType: 'json',
contentType : 'application/json',
success: function (response) { console.log(response); obj.remove(); },
error: function (xhr, ajaxOptions, thrownError) {
console.log(xhr.status);
console.error(thrownError);
},
});
});
});
});
There are some json file names on the page
<div>a.json</div> <div>b.json</div>