如何重置(清除)文件输入

Question

我怎样才能在IE中重置文件输入,我使用了以下内容,它在chrome和FF中工作,但不是IE

fileInputElement.value=""

IE中的替代品是什么？

Answer 1

如果fileInputElement在表单中独立fileInputForm,您可以:

window.fileInputForm.reset();

否则对于IE,你必须用克隆替换元素:

fileInputElement.parentNode.replaceChild(
    fileInputElement.cloneNode(true), 
    fileInputElement
);

Answer 2

解

以下代码适用于jQuery.它适用于每个浏览器,并允许保留事件和自定义属性.

var $el = $(fileInputElement);
$el.wrap('<form>').closest('form').get(0).reset();
$el.unwrap();

DEMO

有关代码和演示,请参阅此jsFiddle.

链接

• 使用jQuery清除<input type ='file'/>

• 如何使用JavaScript重置文件输入

Answer 3

@Gyrocode.com 在 vanilla JS 中的跨浏览器解决方案：

var clearFileInput = function (input) {
  if (!input) {
    return;
  }

  // standard way - works for IE 11+, Chrome, Firefox, webkit Opera
  input.value = null;

  if (input.files && input.files.length && input.parentNode) {
    // workaround for IE 10 and lower, pre-webkit Opera

    var form = document.createElement('form');
    input.parentNode.insertBefore(form, input);

    form.appendChild(input);
    form.reset();

    form.parentNode.insertBefore(input, form);
    input.parentNode.removeChild(form);
  }

}