[英]how to reset (clear) file input
how can I reset file input in IE, I used the following and it worked in chrome and FF but not IE 我怎样才能在IE中重置文件输入,我使用了以下内容,它在chrome和FF中工作,但不是IE
fileInputElement.value=""
what's the alternative in IE ? IE中的替代品是什么?
If fileInputElement
is on its own in the form fileInputForm
, you can do: 如果fileInputElement
在fileInputForm
形式中fileInputForm
,您可以:
window.fileInputForm.reset();
Otherwise for IE you'll have to replace the element with a clone: 否则对于IE,你必须用克隆替换元素:
fileInputElement.parentNode.replaceChild(
fileInputElement.cloneNode(true),
fileInputElement
);
The following code worked for me with jQuery. 以下代码适用于jQuery。 It works in every browser and allows to preserve events and custom properties. 它适用于每个浏览器,并允许保留事件和自定义属性。
var $el = $(fileInputElement);
$el.wrap('<form>').closest('form').get(0).reset();
$el.unwrap();
See this jsFiddle for code and demonstration. 有关代码和演示,请参阅此jsFiddle 。
You can't reset the File input by itself. 您无法自行重置文件输入。 What you can do is wrap your File input in a <form id="form_id">
tag and reset the form. 您可以做的是将您的文件输入包装在<form id="form_id">
标记中并重置表单。 With jQuery you can do $('#form_id')[0].reset();
使用jQuery,你可以做$('#form_id')[0].reset();
and in JavaScript you can do document.getElementById('form_id').reset()
. 在JavaScript中你可以做document.getElementById('form_id').reset()
。
Cross-Browser solution by @Gyrocode.com in vanilla JS: @ 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);
}
}
With IE 10 I resolved the problem with : 使用IE 10我解决了以下问题:
var file = document.getElementById("file-input");
file.removeAttribute('value');
file.parentNode.replaceChild(file.cloneNode(true),file);
where : 其中:
<input accept="image/*" onchange="angular.element(this).scope().uploadFile(this)" id="file-input" type="file"/>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.