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

Question

我有一个简单的 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 函数也会被触发。

有任何想法吗？ 谢谢你。

Answer 1

这是一个常见的 Javascript 问题，但您实际上是在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
}

Answer 2

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

您可以尝试的一件事是：

    statusCode: { 
        404: function() { handleError404("Error at getUsers();") },
        500: function() { handleError500("Error at getUsers();") }
    },