不用先上传图片在回显，直接回显图片方法

在项目过程中可能会遇到一个问题，就是图片到底是上传之后回显还是怎么办，上传之后回显可能造成很多系统上面的图片垃圾所以我找到了以下方法

载体

<input type="file" width="140px" name="img" accept="image/*" onchange="changImg(event)">

<img alt="暂无图片" id="myImg"src=""</c:if> height="100px" width="100px">

一个是上传按钮，一个是用来回显图片的img当然可以只用一个img来做也是可以的，自己改以下就行了，下面就是js了

function changImg(e){

for (var i = 0; i < e.target.files.length; i++) {

var file = e.target.files.item(i);

if (!(/^image\/.*$/i.test(file.type))) {

continue; //不是图片 就跳出这一次循环

}

//实例化FileReader API

var freader = new FileReader();

freader.readAsDataURL(file);

freader.onload = function(e) {

$("#myImg").attr("src",e.target.result);

};

}

}

在js里面写上这个方法，这个方法就是把图片直接放到img里面的一个方法，来源于网络

这样就实现了不用先上传，在回显的问题，而且不用使用别的插件，不过兼容性我没有进行过测试，对兼容性要求比较高建议先测试一下