浏览本地图片(兼容IE9)

来源:互联网 发布:怎样取淘宝店名 编辑:程序博客网 时间:2024/05/21 00:19

直接拷贝运行看效果。

说明:安全问题,所以流浪器是不可能让js去访问本地图片的,这不是浏览本地图片。是伪实现。

<html><head><script>function setImagePreview(localImag,doc,imgId) {var docObj=document.getElementById(doc);var imgObjPreview=document.getElementById(imgId);if(docObj.files &&    docObj.files[0]){//火狐下,直接设img属性imgObjPreview.style.display = 'block';imgObjPreview.style.width = '128px';imgObjPreview.style.height = '128px';                    //imgObjPreview.src = docObj.files[0].getAsDataURL();   //火狐7以上版本不能用上面的getAsDataURL()方式获取,需要一下方式    imgObjPreview.src = window.URL.createObjectURL(docObj.files[0]); }else{//IE下,使用滤镜docObj.select();docObj.blur();//解决IE9的不兼容的问题var imgSrc = document.selection.createRange().text;var localImagId = document.getElementById(localImag);//必须设置初始大小localImagId.style.width = "128px";localImagId.style.height = "128px";//图片异常的捕捉,防止用户修改后缀来伪造图片try{localImagId.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";localImagId.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc;}catch(e){alert("您上传的图片格式不正确,请重新选择!");docObj.select();    document.execCommand("delete");return false;}imgObjPreview.style.display = 'none';document.selection.empty();}return true;}</script></head><body><div id="localImag"><img id="imgId" /></div><input name="image" type="file" id="doc" onchange="javascript:setImagePreview('localImag','doc','imgId');"><body></html>

原创粉丝点击