Stop all active ajax requests in jQuery
Every time you create an ajax request you could use a variable to store it:
var request = $.ajax({ type: 'POST', url: 'someurl', success: function(result){}});Then you can abort the request:
request.abort();You could use an array keeping track of all pending ajax requests and abort them if necessary.
The following snippet allows you to maintain a list (pool) of request and abort them all if needed. Best to place in the <HEAD> of your html, before any other AJAX calls are made.
<script type="text/javascript"> $(function() { $.xhrPool = []; $.xhrPool.abortAll = function() { $(this).each(function(i, jqXHR) { // cycle through list of recorded connection jqXHR.abort(); // aborts connection $.xhrPool.splice(i, 1); // removes from list by index }); } $.ajaxSetup({ beforeSend: function(jqXHR) { $.xhrPool.push(jqXHR); }, // annd connection to list complete: function(jqXHR) { var i = $.xhrPool.indexOf(jqXHR); // get index for current connection completed if (i > -1) $.xhrPool.splice(i, 1); // removes from list by index } }); })</script>
Using ajaxSetup is not correct, as is noted on its doc page. It only sets up defaults, and if some requests override them there will be a mess.
I am way late to the party, but just for future reference if someone is looking for a solution to the same problem, here is my go at it, inspired by and largely identical to the previous answers, but more complete
// Automatically cancel unfinished ajax requests // when the user navigates elsewhere.(function($) { var xhrPool = []; $(document).ajaxSend(function(e, jqXHR, options){ xhrPool.push(jqXHR); }); $(document).ajaxComplete(function(e, jqXHR, options) { xhrPool = $.grep(xhrPool, function(x){return x!=jqXHR}); }); var abort = function() { $.each(xhrPool, function(idx, jqXHR) { jqXHR.abort(); }); }; var oldbeforeunload = window.onbeforeunload; window.onbeforeunload = function() { var r = oldbeforeunload ? oldbeforeunload() : undefined; if (r == undefined) { // only cancel requests if there is no prompt to stay on the page // if there is a prompt, it will likely give the requests enough time to finish abort(); } return r; }})(jQuery);