如何在 JavaScript 中以编程方式设置和更新 FormData 的 FileList 长度？

在 FileList 中为 FormData 对象设置文件对象和长度

问题陈述：

我们如何在其中设置 File 对象FileList 对象，同时还更新 FileList 的 length 属性并确保更改反映在相应的 FormData 中

解决方案：

可以设置 的 .files 属性元素添加到 FileList 对象，但 .files.length 属性最初仍设置为 0。此外，提交表单时，File 对象的 size 属性可能设置为 0。

解决这些问题，我们可以利用 DataTransfer 构造函数。 DataTransfer 对象允许我们创建一个可以通过 DataTransferItemList 访问的可变 FileList 对象。一旦我们有了可变的 FileList 对象，我们就可以设置 File 对象并相应地更新 length 属性。

以下是实现此技术的方法：

const input = document.createElement("input");
input.type = "file";
input.name = "files";
input.multiple = true;

const dT = new DataTransfer();
dT.items.add(new File(['foo'], 'programmatically_created.txt'));

input.files = dT.files;

此代码片段创建一个新的元素和 DataTransfer 对象。然后，它将文件添加到 DataTransfer 对象，并将输入元素的 .files 属性设置为 DataTransfer 对象中的 FileList 对象。

现在，当您访问输入元素的 .files 属性时，您将可以访问通过 DataTransfer 对象设置的 File 对象，并且 FileList 对象的 .length 属性将被正确设置。

此外，当提交表单后，文件对象的大小属性将设置为正确的值。这种方法确保对 FileList 对象所做的更改反映在随表单提交的 FormData 对象中。

以上是如何在 JavaScript 中以编程方式设置和更新 FormData 的 FileList 长度？的详细内容。更多信息请关注PHP中文网其他相关文章！