javascript - 使用 javascript 将文件附加到输入

Question

我有上传文件的输入

<input type="file" name="comment[video_file]" id="comment_video_file">

是否可以通过 JavaScript 附加文件？

我试过了，还是不行

    let file = new File([videoBlob], "video.mp4", { type: "video/mp4" });
    let element = document.getElementById("comment_video_file");
    element.append("video", video);

如果我在追加之后控制台记录元素，它看起来像这样

<input type="file" name="comment[video_file]" id="comment_video_file">
  "video"
  "[object File]"
</input>

Answer 1

创建文件并将其附加到 HTML 表单输入是不可能的，但使用 FormData 对象，您可以将生成的文件作为发布请求的一部分发送到服务器。

从 MDN 中提取:

var formData = new FormData();

// JavaScript file-like object
var content = '<a id="a"><b id="b">hey!</b></a>'; // the body of the new file...
var blob = new Blob([content], { type: "text/xml"});

formData.append("webmasterfile", blob);

var request = new XMLHttpRequest();
request.open("POST", "http://example.com/submitform.php");
request.send(formData);

这应该让您得到与发送到服务器的 JS 生成的文件相同的结果。