javascript - 输入文件上传成功？

Question

我有一个非常复杂的表单，其中有一个"file"输入，例如:

<input type="file" />

是否可以使用 JS 触发某种“上传成功”，以便在用户上传文件后整个表单自行提交？

Answer 1

您可以异步上传文件(如果需要，您可以上传多个文件)。例如:

<input type="file" class="js-file-upload" multiple>

创建input标签后，可以监听change事件

$(".js-file-upload").on("change", function(e){
 var files = e.target.files;
 // your own logic to filter files etc.
 // upload your file
});

完成所有这些之后，您可以收听上传完成事件(例如，在加载所有文件后提交)。Javascript XMLHttpRequest 对象提供了两个事件:upload.progress 和load。所以使用它))

我项目中的伪代码:

file.on("upload.progress", function(e){
  //value show progress
  var value = Math.floor(e.loaded / e.total * 100);
});
file.on("load", function(response){ //logic });