使用jquery/php/html用fileupload值更改img src

Question

我正在做一个facebook选项卡，它可以接受一些文本，也可以使用html fileUpload组件接收图片，其想法是当用户在fileUpload组件中选择图片时，他们选择的图像会出现在页面上，作为将图片上传到服务器之前预览图片的一种方式。我尝试使用val()来填充图像url，但出于安全考虑，浏览器不提供本地文件的完整url。是否有一种使用php或jquery的方法来做到这一点？

谢谢

Answer 1

我相信这就是你要找的

function handleFiles(files) {
  for (var i = 0; i < files.length; i++) {
    var file = files[i];
    var imageType = /image.*/;

    if (!file.type.match(imageType)) {
      continue;
    }

    var img = document.createElement("img");
    img.classList.add("obj");
    img.file = file;
    preview.appendChild(img);

    var reader = new FileReader();
    reader.onload = (function(aImg) { return function(e) { aImg.src = e.target.result; }; })(img);
    reader.readAsDataURL(file);
  }
}

您也可能对阅读其他示例感兴趣，如这一个。

编辑：这个方法依赖于FileReader API，所以它不会像您所指出的那样在IE9上工作，但我认为不可能。

说到底，您需要IE9兼容性吗？您可能会发现添加一个功能是可以接受的，该功能只适用于您的用户基础中的几个百分点。