如果你有以下情况:

<input type="file" id="fileControl">

然后就这样做:

$("#fileControl").val('');

重置文件控件。

你不能重置，因为它是一个只读文件。你可以克隆它来解决这个问题。

@dhaval-marthak在评论中发布的jQuery解决方案显然是有效的，但如果你看看实际的jQuery调用，就很容易看出jQuery在做什么，只是将value属性设置为空字符串。所以在“纯”JavaScript中，它将是:

document.getElementById("uploadCaptureInputFile").value = "";

<input type="file" id="mfile" name="mfile">
<p>Reset</p>

<script>
$(document).ready(function(){
$("p").click(function(){

            $("#mfile").val('');
            return false;

    });
});

重置文件上传按钮是如此容易使用纯JavaScript!

有几个方法可以做到这一点，但必须直接的方法，这是在许多浏览器工作良好的改变文件值为零，这样上传文件得到重置，也尝试使用纯javascript而不是任何框架，我创建了下面的代码，检查一下(ES6):

函数resetFile() { const file = document.querySelector('.file'); 文件。Value = "; ｝ <input type="file" class="file" /> <按钮onclick = " resetFile ()“>重置文件> < /按钮

使用angular，你可以创建一个模板变量，并将其值设置为null

<input type="file" #fileUploader />
<button (click)="fileUploader.value = null">Reset from UI</button>

或者你可以像这样创建一个方法来重置

component.ts

  @ViewChild('fileUploader') fileUploader:ElementRef;

  resetFileUploader() { 
    this.fileUploader.nativeElement.value = null;
  }

模板

<input type="file"/>
<button (click)="resetFileUploader()">Reset from Component</button>

stackblitz试样