显示所选文件而不回发

Question

我有<input type="file">用户选择图像文件。是否可以在页面上显示此图像而无需先将其实际上传到服务器？基本上我想要做的是使用用户计算机上的本地文件。

PS - 我正在使用JQuery。

Answer 1

这是不可能的，即使使用file://引用文件也无法正常工作，因为当您从文件输入框中获取值时，您只获取文件名，而不是路径。因此无法知道图像的位置。要使其工作，您必须使用基于Flash的上传器。

这肯定是一种安全措施，因为Internet Explorer 为您提供了一条路径，唯一的事情就是始终c:\fakepath\filename.png。我猜浏览器正在阻止JavaScript从文件系统中获取任何有意义的信息。

尝试上传文件C:\test.txt时不同浏览器的返回值：

• Firefox 3.5.6
  test.txt

• Chrome 3.0.195.38
  test.txt

• Opera 10.00
  C:\fake_path\test.txt

• Internet Explorer 8
  C:\fakepath\test.txt

Answer 2

不，这是不可能的。 Javascript无法访问本地文件系统。

您要求的是一个巨大的安全风险伪装成“功能请求”。如果可能，那么javascript也可以从本地计算机打开其他类型的文件。例如，MS Word文档 - 您知道可以运行脚本的文件。

Answer 3

在Javascript中不可靠。可以使用基于Flash的上传器，例如this one。

Answer 4

:-)， 我认为这很容易。

document.getElementByid('img1').src = document.getElementById('fileUpload').value;

但在所有浏览器中都无法实现

Answer 5

在Internet Explorer中可以，但是您的用户必须将您的站点添加到“可信站点”，或者您将看到C：\ fakepath \。一旦添加到可信站点，您就可以访问真实路径。

不要指望找到一个很棒的跨浏览器解决方案！