在jsp页面显示选择本地的图片代码

Posted 2020-08-25 写最少的代码

 1 function preview(file) {
 2     var prevDiv = document.getElementById(‘preview‘);
 3     if (file.files && file.files[0]) {
 4         // 支持大多数浏览器， 谷歌， 火狐， 360 ， 欧朋  IE10.
 5         var reader = new FileReader();
 6         //当图片加载完成到内存的时候
 7         // $(function(){})  ==> window.onload= function(){}
 8         reader.onload = function(evt) {
 9             prevDiv.innerhtml = ‘<img src="‘ + evt.target.result + ‘" width="100" height="100"/>‘;
10         }
11         reader.readAsDataURL(file.files[0]);
12     } else {
13         // 支持IE9以下的浏览器
14         prevDiv.innerHTML = ‘<div class="img" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src=\‘‘
15                 + file.value + ‘\‘"></div>‘;
16     }
17 }

 

<label>修改图片：</label>
<div class="lf salebd" id="preview"><a href="#"><img src="<%=path %>/images/ad20.jpg" width="100" height="100" /></a></div>
<input name="auctionPic" type="file" class="offset10 lf" onchange="preview(this)" />