如何重设＜input type = “file”＞

本文翻译自：how to reset

I am developing a metro app with VS2012 and Javascript 我正在使用VS2012和Javascript开发Metro应用程序

I want to reset the contents of my file input: 我想重置文件输入的内容：

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

How should I do that? 我应该怎么做？

#1楼

参考：https://stackoom.com/question/1ODnN/如何重设-input-type-file

#2楼

The jQuery solution that @dhaval-marthak posted in the comments obviously works, but if you look at the actual jQuery call it's pretty easy to see what jQuery is doing, just setting the value attribute to an empty string. @ dhaval-marthak在评论中发布的jQuery解决方案显然有效，但是如果您查看实际的jQuery调用，则很容易看到jQuery在做什么，只需将value属性设置为一个空字符串即可。 So in "pure" JavaScript it would be: 因此，在“纯” JavaScript中，它将是：

document.getElementById("uploadCaptureInputFile").value = "";

#3楼

You can just clone it and replace it with itself, with all events still attached: 您可以克隆它并替换为它，同时保留所有事件：

<input type="file" id="control">

and 和

var input = $("#control");

function something_happens() {
    input.replaceWith(input.val('').clone(true));
};

Thanks : Css-tricks.com 谢谢：Css-tricks.com

#4楼

You can´t reset that since it is an read-only file. 您无法重置该文件，因为它是只读文件。 you can clone it to workaround the problem. 您可以克隆它来解决此问题。

#5楼

您需要将<input type = “file”>包装到<form>标记中，然后可以通过重置表单来重置输入：

onClick="this.form.reset()"

#6楼

SOLUTION 解

The following code worked for me with jQuery. 以下代码适用于jQuery。 It works in every browser and allows to preserve events and custom properties. 它适用于所有浏览器，并允许保留事件和自定义属性。

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

DEMO 演示

See this jsFiddle for code and demonstration. 有关代码和演示，请参见此jsFiddle 。

LINKS 链接

See How to reset file input with JavaScript for more information. 有关更多信息，请参见如何使用JavaScript重置文件输入。