javascript - 即使请求成功也会触发错误回调函数

Question

我有一个使用ajax 发送邮件的脚本。我通过检查将收到邮件的电子邮件进行了测试，确实，ajax 请求成功。我还检查了 Firefox 浏览器的控制台窗口，它也显示了一条成功消息。但我的问题是，触发的是 error 回调函数，而不是 done 回调函数。你们可能都想知道为什么我仍然使用 error 函数而不是 fail。这样做的原因是因为当我尝试使用 fail 函数时，它不会触发我在其中设置的警报框。所以我所做的就是返回并再次使用 error 函数，因为至少它会触发我制作的警报框。

这是脚本:

<script type="text/javascript">
    var submitButton = $('#submit');              // Variable to cache button element
    var alertBox1 = $('.success');                 // Variable to cache meter element
    var alertBox2 = $('.alert');
    var closeButton1 = $('.close1');                  // Variable to cache close button element
    var closeButton2 = $('.close2');                  // Variable to cache close button element

    $( function(){
        $( '#contactform' ).submit( function(e){
            e.preventDefault();
            console.log( 'hello' );
            var formData = $( this ).serialize();
            console.log( formData );

            $.ajax({
                 type: 'POST',
                 url: 'send.php',
                 data: formData,
                 dataType: 'json',
                 done: function(){

                        $(submitButton).fadeOut(500); // Fades out submit button when it's clicked
                        setTimeout(function() { // Delays the next effect
                             $(alertBox1).fadeIn(500); // Fades in success alert
                        }, 500);
                 },
                 error: function(){
                    $(submitButton).fadeOut(500); // Fades out submit button when it's clicked
                        setTimeout(function() { // Delays the next effect
                             $(alertBox2).fadeIn(500); // Fades in fail alert
                        }, 500);
                 }
            });
        });

        $(closeButton1).click(function() { // Initiates the reset function
            $(alertBox1).fadeOut(500); // Fades out success message
            setTimeout(function() { // Delays the next effect
                $('input, textarea').not('input[type=submit]').val(''); // Resets the input fields
                $(submitButton).fadeIn(500); // Fades back in the submit button
            }, 500);

                return false; // This stops the success alert from being removed as we just want to hide it
        });

        $(closeButton2).click(function() { // Initiates the reset function
            $(alertBox2).fadeOut(500); // Fades out success message
            setTimeout(function() { // Delays the next effect
                $('input, textarea').not('input[type=submit]').val(''); // Resets the input fields
                $(submitButton).fadeIn(500); // Fades back in the submit button
            }, 500);

                return false; // This stops the fail alert from being removed as we just want to hide it
        });
    });
</script>

造成这种情况的原因是什么？只是重申一下，我尝试使用 fail 而不是 error 回调函数，因为这是我在互联网上找到的答案之一，也因为我知道一个事实error 函数已被弃用。但由于我上面提到的原因，我别无选择，只能使用它。

Answer 1

如果您引用文档，则无法在ajax函数内使用done作为回调。使用 success 或在 ajax 调用结束时添加 done 。

$.ajax({
   // url, data etc
success: function() {
    //success handler
},
error:function(){
   //Error handler
}
});

     (OR)
$.ajax({
      // ajax related codes
}).done(function(){
     //callback
});

此外，如果您没有真正从服务器返回 JSON，请从 ajax 调用中删除 dataType: 'json',。