出现无法构造“FormData”错误

Question

我的联系表格出了问题。最近一切都很好，但现在我无法发送消息。当我尝试提交表单时，我现在看到此错误：

未捕获的类型错误：无法构造“FormData”：参数 1 不是“HTMLFormElement”类型。在 HTMLFormElement 的 SubmitForm (ajax.js:77) 处。(ajax.js:72) 在 HTMLFormElement.dispatch (jquery-3.3.1.js:5183) 在 HTMLFormElement.elemData.handle (jquery-3.3.1.js:4991)

$(document).ready(function() {
$("#subscribeForm").validator().on("submit", function (event) {
    if (event.isDefaultPrevented()) {
        formError();
        submitMSG(false, "Are you sure you filled form inputs correctly?");
    } else {
        event.preventDefault();
        submitForm();
    }
});
function submitForm(){
            var subscribe_email =$("input[name=subscribe_email]").val();
            var formData = new FormData($(this)[0]);
            formData.append('subscribe_email', subscribe_email );
            $.ajax({
                 url: "include/ajax/subscribe.php",
                 type: "POST",
                 contentType: false,
                 processData: false,
                 data: formData,
                 cache: false,
                 success : function(text){
             if (text == "success"){
                 formSuccess();
             } else {
                 formError();
                 submitMSG(false,text);
             }
         }
     });
 }
function formSuccess(){
    $("#subscribeForm")[0].reset();
    submitMSG("valid", "Your message was successfully sent");
}
function formError(){
  submitMSG("invalid", "Something went wrong. Please, try again or contact with our support team.");
}
function submitMSG(valid, msg){
    if(valid){
        var msgClasses = "cf-alert alert success";
    } else {
        var msgClasses = "cf-alert alert warning";
    }
    $("#success_submit").removeClass().addClass(msgClasses).text(msg);
}
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

出了什么问题，为什么突然坏了？提前非常感谢各位。

Answer 1

该错误说明得非常清楚。

未捕获的类型错误：无法构造“FormData”：参数 1 不是“HTMLFormElement”类型。在 HTMLFormElement 的 SubmitForm (ajax.js:77) 处。(ajax.js:72) 在 HTMLFormElement.dispatch (jquery-3.3.1.js:5183) 在 HTMLFormElement.elemData.handle (jquery-3.3.1.js:4991)

var formData = new FormData($(this)[0]); // $(this)[0] is not a form element 在您的代码中$(this)[0]绑定到全局对象（浏览器中的窗口）

您可以像这样传递对表单的引用：

$("#subscribeForm").on("submit", function (event) {
    event.preventDefault();
    submitForm(this);
});

function submitForm(myForm){
    const formData = new FormData(myForm);
    // or like this
    // const myForm = document.getElementById("subscribeForm");
    // const formData = new FormData(myForm);

}

在您的情况下，您可以调用 FormData 构造函数，而无需任何参数，因为您执行了 formData.append()

const formData = new FormData();
formData.append("some_key", "some_value");

您可以在此处阅读有关 formData 的更多信息