FORMDATA對象添加整個窗體，而無需創建新的對象

我有一個提交代碼如下：FORMDATA對象添加整個窗體，而無需創建新的對象

$(document).on("submit","form",function(event){ 
    event.preventDefault() 
    formData=new FormData(this) 
})

但有時我已經提交

formData=new FormData()  
formData.append("test",1)

結果之前，下面做，調用新的FormData對象刪除附加的數據。如何在不創建新對象的情況下追加整個表單？事情是這樣的：

$(document).on("submit","form",function(event){ 
    event.preventDefault() 
    FormData.append(this) // not new just appended entire form 
})

來源

2015-12-01 Maciek Semik

我假設你formData變量您.on("submit", "form", ...)功能之外聲明。

您可以在表單上使用jquery的serializeArray()。 serializeArray()函數將爲您的表單中的每條數據返回一個包含具有name和value屬性的對象的數組。然後，您可以遍歷該陣列並使用formData實例上的.append()函數將表單中的所有輸入添加到formData。

請注意，您需要在表單中的每個元素上使用name屬性才能正常工作。請參閱下面的工作示例，該示例將每個表單項都記錄到瀏覽器控制檯，然後將其添加到formData實例。

var formData = new FormData(); 
 
formData.append("test", 1); 
 

 
$(document).on("submit", "form", function(event) { 
 
    event.preventDefault(); 
 
    var formDataArray = $(this).serializeArray(); 
 
    for(var i = 0; i < formDataArray.length; i++){ 
 
    var formDataItem = formDataArray[i]; 
 
    console.log(formDataItem); 
 
    formData.append(formDataItem.name, formDataItem.value); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form> 
 
    <label for="name">Name:</label> 
 
    <input type="text" id="name" name="name"/> 
 
    <label for="age">Age:</label> 
 
    <input type="number" id="age" name="age"/> 
 
    <button type="submit">Submit</button> 
 
</form>

來源

2015-12-01 19:23:37

FORMDATA對象添加整個窗體，而無需創建新的對象

回答

相關問題