如果你使用的是Angular，双向绑定对我来说是有效的。

这是我的HMTL

<input type="file" #upload name="upload" [(ngModel)]="inputValue"(change)='fileEvent($event)'/>

和TS . .

  @ViewChild('upload') uploadBtn: HTMLElement;

  fileEvent(e: any){
    
   //file upload part... 

    this.inputValue = "";
  }

在本文中，在“使用表单输入进行选择”的标题下

http://www.html5rocks.com/en/tutorials/file/dndfiles/

<input type="file" id="files" name="files[]" multiple />

<script>
function handleFileSelect(evt) {

    var files = evt.target.files; // FileList object

    // files is a FileList of File objects. List some properties.
    var output = [];
    for (var i = 0, f; f = files[i]; i++) {
     // Code to execute for every file selected
    }
    // Code to execute after that

}

document.getElementById('files').addEventListener('change', 
                                                  handleFileSelect, 
                                                  false);
</script>

它添加了一个事件监听器的“改变”，但我测试了它，它触发即使你选择相同的文件，而不是如果你取消。

在文件成功加载后，可以做任何您想做的事情。完成文件处理后，将文件控制的值设置为空白字符串。因此.change()将始终被调用，即使文件名更改与否。举个例子，你可以做这件事，对我来说很有魅力

   $('#myFile').change(function () {
       LoadFile("myFile");//function to do processing of file.
       $('#myFile').val('');// set the value to empty of myfile control.
    });

<form enctype='multipart/form-data'>
    <input onchange="alert(this.value); this.value=null; return false;" type='file'>
    <br>
    <input type='submit' value='Upload'>
</form>

this.value =零;只是必要的Chrome, Firefox将工作良好只是返回false;

这是一把小提琴

在每个onclick事件上将输入值设置为空。这将重置输入的值并触发onchange事件，即使选择了相同的路径。

var input = document.getElementsByTagName('input')[0]; 输入。Onclick = function () { 这一点。Value = null; }; 输入。Onchange = function () { console.log (this.value); }; <input type="file" value="C:\fakepath">

注意:如果你的文件前缀是'C:\fakepath'，这是正常的。这是一个安全特性，可以防止JavaScript知道文件的绝对路径。浏览器内部仍然知道它。

<input #myInput type="file" id="imgFile" (click)="$event.target.value=null"
       (change)="detectUploadedImage($event)" accept="image/*" />