显示选择在Chrome和Mozilla上传的图片

时间:2012-02-28 04:51:27

标签: javascript html google-chrome file-upload

在我的一个网络应用程序中,我必须使用javascript显示在上传到服务器之前选择上传的图像。

我有这个代码......它在Mozilla中工作得非常好。但不适用于Safari或Chrome ..请帮忙

// Handle file while select a new file
$('#file').change(function(){
        $('#img_size').val((this.files[0].size)/1000000);
                   handleFiles(this.files);
});


// handle files

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.getElementById('fake_img');
     img.src = file;
     img.onload = function() {



    };



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

}

1 个答案:

答案 0 :(得分:2)

此代码在chrome

中运行良好

http://jsfiddle.net/PrNWY/13/

它以chrome&amp; amp;显示所选图像。 FF。

<强>更新

您可以使用以下代码检查文件阅读器功能

// Check for the various File API support.
if (window.File && window.FileReader && window.FileList && window.Blob) {
    // Great success! All the File APIs are supported.
    alert('The File APIs are fully supported in this browser.');
 } else {
    alert('The File APIs are not fully supported in this browser.');
 }

在我的safari中它失败了,因为它没有完全支持文件API。