输入文件字段到输入文本字段答案

【问题标题】：Input File field to Input Text field输入文件字段到输入文本字段
【发布时间】：2011-04-11 20:47:34
【问题描述】：

我什至不知道这是否可能，但有没有一种方法可以将输入 file 字段中所选文件的值输入 text强>领域？

像这样：

【问题讨论】：

标签： javascript file input field input-field

【解决方案1】：

如果不先将文件存储在您自己的服务器上，您将无法做到这一点。

文件输入控件不包含文件的数据。在您通过 POST 表单提交提交文件数据之前，您的浏览器会将其作为占位符提供给您。

如果你在寻找文件的路径，你也不能这样做（在现代浏览器中，正如 Pekka 所说）。浏览器不会将该信息提供给客户端脚本。但是，它可能会提供文件名。

【讨论】：

我认为他只想复制文件路径，而不是其数据。
我很确定可以读取该值，但不能写入。所以他感兴趣的是可行的。请参阅 BalusC 的回答。

【解决方案2】：

挂钩文件字段的change 事件。

<form method="post" enctype="multipart/form-data">
    <input type="file" onchange="this.form.filename.value = this.value">
    <input type="text" name="filename">
</form>

Jsfiddle demo。请注意，IE6/7 错误地给出了完整路径，而其他浏览器正确地只给出了文件名。

【讨论】：

MSIE 从 IE 8 开始也应该只给出文件名。
@Pekka：我偷看了你的个人资料。亚马逊的愿望清单有效果吗？有趣的想法:)
不，还没有！我真的希望有一天能看到该列表中的某些内容:)
输入文件为“多个”时怎么办？如何获取所有选定文件的值？

【解决方案3】：

这应该可以通过创建一个新的文本输入元素并使用文件输入的.value 属性填充它来实现。

但是请注意，出于安全原因，所有现代浏览器仅在value 属性中存储文件名。您将无法获得所选文件的完整路径。

来源：MSDN on IE8

【讨论】：