Question

我创建了一个FormData对象，并使用以下代码行向其追加元素。它适用于我，但我想知道是否有重构的方法来做到这一点。

var form_data = new FormData();

//Append the data into the FormData object 
form_data.append('action', 'my_action');
form_data.append('username', $("[name=username]").val());
form_data.append('email', $("[name=email]").val());
form_data.append('first_name', $("[name=first_name]").val());
form_data.append('last_name', $("[name=last_name]").val());
form_data.append('website', $("[name=website]").val());
form_data.append('password', $("[name=password]").val());

我将这个form_data发送到ajax。

$.ajax({
    url: register_data.admin_url,
    type: 'POST',
    data: form_data,
    processData: false,
    contentType: false, 
    success: function( response ) {
        alert( 'Got this from the server: ' + response );
    }
});

Answer 1

假设您要在请求中的form标记内发送所有表单输入的值，那么您可以通过向form提供FormData的引用来简化代码。构造函数。试试这个：

$('#myForm').submit(function(e) {
    e.preventDefault();
    $.ajax({
        url: register_data.admin_url,
        type: 'POST',
        data: new FormData(this), // < populates the FormData with all values in the form
        processData: false,
        contentType: false, 
        success: function(response) {
            alert('Got this from the server: ' + response);
        }
    }); 
});

Answer 2

您只需将表单传递给FormData到retrieve data from HTML

的构造函数即可

<强> HTML

<form name="foo">
    ...
</form>

<强> JS

var form = document.forms.namedItem("foo");
form.addEventListener('submit', function(ev) {
      var form_data = new FormData(form);
}

如何重构此代码块以将数据附加到对象

2 个答案: