как сбросить (очистить) ввод файла

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

• Как сбросить ввод файла с помощью 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);
  }

}

Answer 4

Вы не можете сбросить ввод файла самостоятельно. Что вы можете сделать, это обернуть введенный вами файл в тег <form id="form_id"> и сбросить форму. С jQuery вы можете делать $('#form_id')[0].reset();, а в JavaScript вы можете делать document.getElementById('form_id').reset().

Answer 5

С 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"/>