本地上传预览图片
要实现在本地选择图片后，即可进行预览功能，总体来说有两种方法：方法1、使用AJax上传组件，选择文件后自动通过AJax将文件上传到服务器中，然后返回图片在服务器的地址
好处：这种方法不存在浏览器的兼容问题
缺点：对服务器的压力比较大
方法2：在本地使用JS针对不同的浏览器进行操作
好处：速度快
缺点：要处理跨浏览器的问题
我重点说下方法2：
<img>元素：
<table style="border: 0px; width: 400px;"><tr><td align="center"><img id="disImage"style="display: none; filter: progid : DXImageTransform . Microsoft . AlphaImageLoader(sizingMethod = scale);"width="106" height="106"src="${contextPath}/admin/commonlink/pic/blank.gif" /></td></tr></table>
<file>元素：
<input type="file"onchange="handler()"/>
handler()函数：
var picPath = getPath(document.getElementById(picName)); if(this.getValue()==""){ document.getElementById("disImage").style.display="none"; }else{ document.getElementById('disImage').src = picPath; document.getElementById("disImage").style.display="block"; }
获得文件路径的函数：针对不同的浏览器进行处理
function getPath(obj){ if(obj){ //ie if (window.navigator.userAgent.indexOf("MSIE")>=1){ obj.select(); // IE下取得图片的本地路径 return document.selection.createRange().text; }else if(window.navigator.userAgent.indexOf("Firefox")>=1){ //firefox if(obj.files){ // Firefox下取得的是图片的数据 return obj.files.item(0).getAsDataURL(); } return obj.value; } return obj.value; } }
页:
[1]