jQuery: Automatically abort AjaxRequests on Page Unload?

Question

Hi All,

Thanks for reading.

I've noticed that if I have a page that has one or more ajax requests open, and I click a link to leave a page, or refresh it, it will wait for the ajax requests to complete before unloading.

This isn't usually an issue, but if the request takes a while, it can be.

I'm looking for something like:

$(window).bind("beforeunload", function() {AjaxRequest.abort();});

to automatically abort requests before unload, but not quite sure how to find the ajax requests. Would they be under window somewhere?

Answer 1

Think you need window.onunload event plus AjaxRequestX = $.get(...) for each request, maybe keep objects in array and go through them on unload.

Answer 2

The $.ajax() jQuery method returns the XMLHttpRequest Object. This means you can apply standard methods on the object, like abort().

To unload use the built in unload jQuery event method.

var myajax = $.ajax(...); 
$(window).unload( function () { myajax.abort(); } );