清除<输入类型=文件>

Question

我正在编写HTA，希望用户能够轻松地使用浏览器选择.txt文件。此.TXT文件将通过行读取并读取为数组。因此，我正在使用<input type=file name="ListFile">，它为我提供了浏览功能，并且可以做我需要的...

但是，当用户选择另一种方法时，我需要清除<input type=file name="ListFile">的文本框，我已经设置了，以输入数据。

我需要清除的原因是防止用户错误/错误。我目前已经设置了使用浏览选项时清除手动输入文本框的设置，但无法以另一种方式工作。

我尝试了以下（在常规文本框上使用）

Document.getElementByID("ListFile").value = ""
Document.getElementByID("ListFile").reset()
Docuemnt.getElementByID("ListFile").innerHTMl = ""
ListFile.Value = ""

这些都没有清理文本框。

Answer 1

出于安全原因，您无法在文件输入字段中修改所选文件。

有一个可重置的解决方法 - 您可以克隆文件输入，然后用克隆输入替换输入。在您的情况下，只需根据用户的选择即可显示/隐藏输入。

例如，您可以拥有一组无线电按钮供用户选择输入方法 - 然后根据他们选择的哪个单选按钮显示适当的字段。

如果您绝对必须重置文件输入，则可以使用jQuery的.clone()方法，或者手动创建一个新的DOM元素，在所有属性上复制，在原始文件输入之后插入它，然后删除原件。

。

Answer 2

谢谢Sam Dufel ...您给了我一个主意。

创建了一个创建on window_onload

的跨度

跨度代码：

window_onload代码： browsefile.innerhtml ="

i然后将其复制到另一个在选择"手动数据输入选项"选项时运行的子。基本上清除跨度并重新创建输入。

Answer 3

您无法更改文件输入类型的值，因为这会引入安全漏洞。相反，只需将文件输入替换为新文件即可。而不是$('#file').val('')，执行此操作：

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

最好是克隆原始版本的副本并将其存储在内存中。当您需要更换它时，只需使用克隆的副本，然后再次克隆它。所以，类似的东西：

$(document).ready(function() {
    var empty_input = $('#file').clone();
    $('#the-form').on('change', '#file', function(el) {
        $('#the-form').submit(); // assuming the target is a hidden iframe
        $(this).replaceWith(empty_input.clone());
    });
})

请注意，我正在使用jquery.on（）使用委派版本，因此该事件在替换后仍可以在新输入上使用。