通过Javascript进行Html文件上传预览

时间:2009-08-11 11:21:40

标签: javascript jquery html file

我想为帖子展示一个PREVIEW类型的东西,所以需要JS的详细信息

但问题出现在<input type="file",它没有提供文件的完整路径

例: 如果我做

$("#image").val();

它只给“Sunset.jpg”而不是C:\ Documents and Settings \ All Users .... \ Sunset.jpg

任何想法如何获得该细节值?

5 个答案:

答案 0 :(得分:10)

虽然正如其他人已经指出的那样,你无法在JavaScript中学习文件的完整路径,但是对问题采用完全不同的方法可能仍然适用于你。

您可以在访问者选择照片后自动上传照片(您在GMail中看到的行为以及其他应用程序),即使访问者继续与您的网页进行互动,它也会驻留在您的服务器上。此时,显示预览就像从您自己(现在服务器端)的图像副本自己提供预览一样简单。

答案 1 :(得分:1)

这是出于安全原因,因此您无法使用JavaScript从用户系统中读取文件。

如果您找到解决方法,浏览器供应商可能会尽快发布安全补丁。我知道,因为在IE的早期版本中,可以读取完整路径并因此显示预览,至少如果文件是图像。我在CMS用户界面中使用过它,但当然这个漂亮的功能被IE服务版本破坏了: - /

通常,出于安全原因,文件上传控件有点像“黑匣子”。您只能非常有限地访问脚本和样式。这样您就无法在用户不知情的情况下窥探或上传文件,或者因此您无法诱骗用户使用欺骗性界面上传文件。

答案 2 :(得分:1)

现在可以从Firefox 3.6开始 https://developer.mozilla.org/en/DOM/FileList

虽然他们展示的代码似乎在Chrome中不起作用,但我猜这个类似的HTML5 JavaScript API还没有标准化。

答案 3 :(得分:0)

这是一项安全功能。您无法在安全的浏览器中更改或获取整个路径,因此无法完成您想要做的事情。如果你使用像Flash,Silverlight或Java这样的东西,那么它应该相对容易。

答案 4 :(得分:0)

据我所知,没有办法在javascript中做你想做的事情。这是一个非常大的安全问题 - 在浏览器中访问文件系统。

有一些浏览器插件(java / flash / gear)可能允许你做这类事情。我知道使用齿轮可以让用户选择一个文件 - 并打开它以使用JS读取内容。