关于$.ajax 中complete方法重复多次（4次）调用的浅显研究

本文链接：https://blog.youkuaiyun.com/bokestudy/article/details/79425772

本文探讨了在使用jQuery的$.ajax方法时，complete回调函数被多次触发的问题。通过分析发现，每次Ajax请求的不同阶段都会调用complete，导致统计代码重复执行。文章提供了判断readyState来避免该问题的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

做项目的时候遇到过这样的一个问题：

var url = 'http://www.xxx.com?sss=xx&dd=ss';
$.ajax({
url : url,
dataType : "json",
success : function(data) {
console.log(data);
},
complete: function(XMLHttpRequest, textStatus) {
console.log(XMLHttpRequest);
console.log(textStatus);
}

});

其中统计数据的时候需要再complete方法中发送请求，问题来了

发现统计的数据有重复的，相同的数据有四条！

检查半天发现complete被调用了四次，一开始以为是ajax被请求了四次，complete方法中console.log(XMLHttpRequest);打印数据发现如图：

很明显readyState不同！

查阅网上对readyState的解释：

也就是说一个ajax请求的时候有五种状态，而后四种每一种都调用一次complete，如果不深究，readyState=4也就是第四次调用的时候，会得到我们的结果，所以，我们认为complete方法是在ajax完成之后才执行的！

为此，我查阅了一下官方文档对complete的解释：

翻译很简单，就是说在请求完成之后，才会调用complete方法！

那么，真的是这么翻译的么？

jQuery使用已经好多年，难道没有人发现这一点么还是我理解错了？

望看到的大神赐教！！！

解决方法：

不管怎么样，我给出我的解决方法：

var url = 'http://www.xxx.com?sss=xx&dd=ss';
$.ajax({
url : url,
dataType : "json",
success : function(data) {
console.log(data);
},
complete: function(XMLHttpRequest) {

if(XMLHttpRequest.readyState==4){

//添加你的代码

}

});