javascript - HTML Input tag, with type file, in some cases doesn't catch "oninput " event

Question

So, in my file upload page, I have a file dragging and dropping area. By clicking on this area, the file input dialog appears to allow the user to select files. In some random cases after selecting the files and clicked Open, the oninput event is not emitted. Am I doing something wrong?

I tried to change the oninput event to onchange. And it's not working to. Has anyone had this problem? Thanks in advance.

let input = document.createElement("input");
input.type = "file";
input.style.cssText = "display:none;";
input.multiple = true;
input.accept = "." + this.options.allowedFileType;
input.oninput = () => {
Array.from(input.files).forEach(file => {
      if (file.type === "application/pdf") {
        self.setUniqueUuidAndStoreFile(file);
      } else {
        self.displayErrorNotification(
        this.$t("file") + " " + file.name + " " + this.$t("wrongFileType")
      );
    }
  });
};
input.ondrop = function (event) {
  return false;
};
input.click();

标签： javascripthtml

Answer 1

这是“正常”系统不时注册更改，因为出于安全原因，它看不到整个文件。我们使用的解决方法是将点击时的值设置为 null

input.onclick = function () {
    this.value = null;
};