Question

有没有办法在javascript中加载图像的完整二进制文件？
我想要做的是允许用户在上传之前预览图像即用户选择本地驱动器上的图像（C：\ image.jpg），查看，并决定上传或取消。
我试图将源设置为图像路径，但它不起作用，因为它在webapplication项目文件夹之外有什么帮助吗？

Answer 1

thx你的帖子，但我最终在服务器上创建一个临时文件夹，使用ajax存储上传的图像。当用户保存数据时，图像将移动到另一个位置，并删除临时文件夹。

Answer 2

您可以这样做：

<img id="preview" src="" style="display:none;" />

<form>
....
<input type="file" id="file" />
....
</form>

<script type="text/javascript">
  var file = document.getElementById("file");
  var img = document.getElementById("preview");

  file.onchange = function(){
    img.src = file.value;
    img.style.display = 'block';
  };
</script>

Answer 3

没有简单的方法，你能做什么：

使用某个ajax文件上传器将图像预加载到临时区域，然后让用户决定
使用一些第三方书面解决方案（例如某些闪存组件）

这里也有类似的问题： is it possible to preview local images before uploading them via a form?

Answer 4

您需要服务器合作才能访问图像二进制数据。您无法使用“上传表单”访问文件信息而无需将其上传到服务器。

然而，你可以做一些事情，比如告诉用户将图像的源二进制数据粘贴到textarea或其他东西，然后你就可以使用JavaScript加载那些二进制数据并显示实际的图像。

Answer 5

某些浏览器可通过HTML5文件访问API使用此功能。这是Firefox documentation for file access。

Answer 6

有几次回答，由于安全限制，您无法使用纯HTML / JavaScript执行此操作。无论如何你需要发送图像。但是，您可以使用Java Applet处理此问题，因为它完全在客户端计算机上运行，并提供比HTML / JS更多的控制。有几个免费和即用的。 JumpLoader看起来不错，一些主要网站也使用它。使用Flash也应该可以，但我不确定哪些提供此功能。检查/试用一些Flash Multi File Uploaders。

通过javascript加载图像

6 个答案: