How can I abort an AJAX call? [duplicate]

Question

I am planning on implementing a series of jQuery AJAX calls in my website and would like to develop a function to abort an AJAX call. How can I do this? I read this link already but it doesn't work for me.

Answer 1

You need to assign your ajax request to variable,

var xhr = $.ajax({
***
});

then call abort()

xhr.abort();

Answer 2

In a single use of AJAX it is simple. The XMLHttpRequest has a abort method, which cancels the request.

// creating our request
xhr = $.ajax({
url: 'ajax/progress.ftl',
success: function(data) {
//do something
}
});

// aborting the request
xhr.abort();

The xhr object also contains a readystate which contains the state of the request(UNSENT - 0, OPENED - 1, HEADERS_RECEIVED - 2, LOADING - 3 and DONE - 4). So we can use this to check whether the previous request was completed.

// abort function with check readystate
function abortAjax(xhr) {
if(xhr && xhr.readystate != 4){
xhr.abort();
}
}

// this function usage
abortAjax(xhr);