其核心是利用将图片读取成同样大小的base64字符。

1、未上传图片

未上传的效果

2、上传图片后的预览效果

上传图片后的预览效果

jQuery核心代码：

<script>

$('.a').change(function(e) {

var purl = window.URL || window.webkitURL;

var file, img;

if((file = this.files[0])) {

img = new Image();

img.onload = function() {

$('.img').attr('src', this.src);

};

img.src = purl.createObjectURL(file);

}

})

</script>

HTML核心代码：

<img class="img" width="150" height="150">

<input type="file" class="a">