如何重置<input type = "file">

我正在用VS2012和Javascript开发一个地铁应用程序

我想重置我的文件输入的内容:

<input type="file" id="uploadCaptureInputFile" class="win-content colors" accept="image/*" />

我该怎么做呢?

当前回答

重置输入文件是非常单一的

$（'input[type=file]'）.val（null）;

如果你绑定重置文件中更改表单的其他字段，或者用ajax加载表单。

本例适用

选择器，例如$('input[type=text]')或表单的任何元素

事件单击，更改，或任何事件

$('body').delegate('event', 'selector', function(){
     $('input[type=file]').val(null) ;
});

其他回答

只使用:

$('input[type=file]').val('');

在IE 10中，我解决了这个问题:

    var file = document.getElementById("file-input");
    file.removeAttribute('value');
    file.parentNode.replaceChild(file.cloneNode(true),file);

地点:

<input accept="image/*" onchange="angular.element(this).scope().uploadFile(this)" id="file-input" type="file"/>

使用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试样

这是最好的解决方案:

input.value = ''

if(!/safari/i.test(navigator.userAgent)){
  input.type = ''
  input.type = 'file'
}

在所有的答案中这是最快的解。没有输入克隆，没有窗体重置!

我在所有浏览器中都检查了它(它甚至支持IE8)。

有许多方法，我将建议去参考附件输入。

<input
    id="image"
    type="file"
    required
    ref={ref => this.fileInput = ref}
    multiple
    onChange={this.onFileChangeHandler}
/>

在提交后清除值。

this.fileInput.value = "";

推荐文章