如果您的HTML表单包含这样的元素:
<input type="file" name="file" multiple="multiple">
然后,通常它将允许用户选择要上传的多个文件,并且它们都将以相同的表单字段名称“file”发送到服务器。
我了解,出于安全原因,浏览器不会让JavaScript只为所选文件设置任何值,这是一件好事。
我只是想知道,一旦用户选择了文件,我想让多个表单分别执行上传。有没有一种方法可以:
每个元素的文件选择?
到单独的输入type = file元素,或什至以不同的形式
屏幕?
最佳答案
如果克隆input[type=file]
元素,则克隆的值为空白。您也不能将值从一个文件输入复制到另一文件。
选择文件后,我从未尝试将文件输入从一个文档移动到另一个文档。我想当您这样做时浏览器也会清除选择,但可能不会。 (更新:在经过测试的三种浏览器中,所有都保留了的值,这令我惊讶。请参见下文。)
从根本上讲,如果要使用单独的表单分别上载文件,则需要在用户做出选择之前以单独的表单开始输入。但是显然您可以移动它们,这将使您可以做自己想做的事情。为了避免不得不移动表格,我可能仍会以不同的表格开始。
有趣的是,Chrome,Firefox和IE10至少似乎很乐意将一个文件元素及其选择保持不变,甚至移至另一个文档:Live Example | Source
HTML:
<input id="theFile" type="file">
<br>Choose a file above, then either:
<br><input type="button" id="btnClone" value="Clone">
<input type="button" id="btnMove" value="Move to iframe">
<br>
<iframe id="theFrame" style="width: 99%"></iframe>
JavaScript:
(function() {
gid("btnClone").onclick = function() {
display("Here's the clone:");
document.body.appendChild(gid("theFile").cloneNode(true));
};
gid("btnMove").onclick = function() {
gid("theFrame").contentDocument.body.appendChild(gid("theFile"));
display("File input moved to the iframe");
};
function gid(id) {
return document.getElementById(id);
}
function display(msg) {
var p = document.createElement('p');
p.innerHTML = String(msg);
document.body.appendChild(p);
}
})();
通过上述操作,如果我选择了某项并单击“移至iframe”按钮,则输入将被移动,显然是完整的。 (克隆清除了该值,如预期的那样。)
关于javascript - 是否可以使用JavaScript删除输入类型=文件选择?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/21721475/