javascript - 无法填充 FormData 对象

Question

尝试找出 FormData，但无法填充它。其他类似的问题是因为 form 元素缺少 name 属性，但情况似乎并非如此。

HTML 代码:

<form class="testForm" action="/database" method="put">
            <input type="text" name="bar" value="foo">
</form>
<button type="button" class="testButt" name="testButt">click me!</button>

JS代码:

const testButt = document.querySelector('.testButt');
const testForm = document.querySelector(".testForm");

putDataTest = function(){

    var xhr = new XMLHttpRequest();
    var formData = new FormData(testForm);
    console.log(formData);      // using existing form as a source, returns an empty formData object;
    formData.append("foo", "bar");
    console.log(formData);      // populating the object explicitly, still empty formData object;
    xhr.open('PUT', '/database');
    xhr.send(formData);         // server sees req.body as empty
}

testButt.addEventListener("click", putDataTest);

Answer 1

尝试

console.log(document.forms[0].bar.value); // gets value from textbox.

创建您自己的表单数据:

var formData = new FormData();     // this is a *new* FormData object.
formData.append('foo', 'bar');
console.log(formData.get('foo'));