javascript - 无法清除javascript jquery中的输入类型=文件

Question

可能重复：
使用 jQuery 清除 <input type='file' />

这是我的代码：

 <input ID="fileUpload1" runat="server" type="file" style="width:275px; position:absolute; left:1px"/>

我尝试了一些解决方案：

$("input[type='file']").val('');
$('#DivfileUpload').replaceWith("<input class=VWButton ID=fileUpload1 runat=server type=file style=width:275px; position:absolute; left:1px/>");

以及来自网络的许多其他人，但没有成功。

Answer 1

出于（明显的）安全原因，您不能设置文件输入的值。

如果要清除它，则需要重置它所在的表单。

---

用新的替换它也应该有效，但要使用有效的代码。（这意味着不要尝试包含诸如 ASPrunat=server属性/值之类的服务器端代码，并且不要引用不是普通单词的属性值（例如您的样式属性））。

Answer 2

出于安全原因，在某些浏览器（如 IE）中尝试使用 .val('') 设置值会失败。

您最好的选择是重置表单：

$('form').trigger('reset');

---

或者使用您的替换代码，稍作修改（确保 HTML 有效）：

$('#fileUpload1').replaceWith('<input id="fileUpload1" type="file" style="width:275px; position:absolute; left:1px"/>');

如果您使用 CSS 设置框的样式，您的代码会变得更加简单。

CSS：

#fileUpload1 {
    width: 275px;
    position: absolute;
    left: 1px;
}

JavaScript：

$('#fileUpload1').replaceWith('<input id="fileUpload1" type="file"/>');

---

一个更高级的选项是在页面加载时隐藏文件上传框，然后创建一个向用户显示的副本。当你需要清除它时，你删除克隆，然后重新克隆原来隐藏的那个。如果您希望允许用户上传多个文件，此方法还允许您制作输入框的多个副本。我将把实现细节留给你。;)

Answer 3

$(function() { 
  $('#fileUpload1').val(''); 
});