其核心是利用将图片读取成同样大小的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">