将输入文件字段转换为输入文本字段

Question

我不知道这是否可能，但是否有一种方法可以将输入文件字段中所选文件的值传递到输入文本字段中？就像这样：。

- MacMac

Answer 1

监听文件域的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示例。请注意，IE6/7会错误地给出完整路径，而其他浏览器则正确地只给出文件名。

- BalusC

---

自IE8以来，MSIE也应该仅提供文件名。 - Pekka

@Pekka：我看了一下你的个人资料。那个Amazon.com的愿望清单有用吗？很有趣的想法 :) - BalusC

不，还没有！我真的很希望有一天能从那个列表中看到某些东西出现 :) - Pekka

当输入文件是“多个”时怎么办？如何获取所选所有文件的值？ - spuas

Answer 2

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

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

来源：IE8 上的 MSDN

- Pekka

Answer 3

如果没有先将文件存储在自己的服务器上，您将无法完成此操作。

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

如果您想获取文件路径，则也无法在现代浏览器中实现（如Pekka所说）。浏览器不会向客户端脚本提供该信息。但是，它可能会提供文件名。

- palswim

---

我认为他只想复制文件路径，而不是数据。 - Pekka

我非常确定该值可以被读取，但无法被写入。所以他感兴趣的是可行的。请参考BalusC的答案。 - levik