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

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


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="http://www.mamicode.com/‘ + 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=http://www.mamicode.com/‘‘"color: #008080">15 + file.value + ‘\‘"></div>‘; 16 } 17 }

 

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

 

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