为什么Jquery$.ajax在函数调用中触发所有statusCode，即使调用成功

Why is Jquery $.ajax firing all statusCode on function call even with successful call

本文关键字：statusCode 成功 调用 ajax Jquery 函数调用 为什么      更新时间：2023-09-26

我有一个简单的Jquery ajax函数调用，如下所示。

function getUsers(){
    var jqxhr = $.ajax({
        url: "../assets/js/data/users.json",
        type: "GET",
        cache: true,
        dataType: "json",
        statusCode: { 
            404: handleError404("Error at getUsers();"),
            500: handleError500("Error at getUsers();")
        },
        success: function (data) {
            $.each(data, function(index, element) {
                console.log(element.name);
            });
        }
    });
}

错误句柄函数如下所示。

function handleError500(customMsg){
    alert("Oops, there was an error: 500");
    console.log("ERROR: 500 | "+customMsg);
}
function handleError404(customMsg){
    alert("Oops, there was an error: 404");
    console.log("ERROR: 404 | "+customMsg);
}

出于某种奇怪的原因，即使在没有明显错误500或404的成功调用中，statusCode函数也会启动。

有什么想法吗？非常感谢。

这是一个常见的Javascript gotcha，但您实际上是这些函数的firing！

名称后面的()此时将实际调用该函数。

404: handleError404() // <-- it calls it immidiately

您需要做的是创建一个匿名函数，当错误实际发生时，该函数稍后将被调用，该函数内部将调用您的函数。

    statusCode: { 
        404: function () { // <-- anonymous function won't get called until it needs to
            handleError404("Error at getUsers();")
        },
        500: function () { 
            handleError500("Error at getUsers();")
        }
    },

附带说明：如果没有向函数传递参数，实际上，您可以提交匿名函数function () { /* function call */ }部分，然后调用您的函数！

statusCode: {
    404: handleErrors, // since no parameters are passed, this could be done
    500: handleErrors
}

因为在对象属性的定义中，您实际上是在调用函数，而不是在代码实际发生时定义要调用的函数。

你可以尝试的一件事是：

    statusCode: { 
        404: function() { handleError404("Error at getUsers();") },
        500: function() { handleError500("Error at getUsers();") }
    },
相关文章：