<head> ???<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></head> <body><div id="localImag"> ???<img id="preview" style="display:block; border:1px solid red; width: 150px; height: 180px;"></div><input id="doc" type="file" name="file" onchange="javascript:setImagePreview();"><script type="text/javascript"> ???//下面用于图片上传预览功能 ???function setImagePreview(avalue) { ???????var docObj=document.getElementById("doc"); ????????var imgObjPreview=document.getElementById("preview"); ???????if(docObj.files && docObj.files[0]){ ???????????imgObjPreview.src = window.URL.createObjectURL(docObj.files[0]); ???????}else{ ???????????????//IE低版本下,使用滤镜 ???????????docObj.select(); ???????????var imgSrc = document.selection.createRange().text; ???????????var localImagId = document.getElementById("localImag"); ???????????//必须设置初始大小 ???????????localImagId.style.width = "150px"; ???????????localImagId.style.height = "180px"; ???????????//图片异常的捕捉,防止用户修改后缀来伪造图片 ???????????try{ ???????????????localImagId.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)"; ???????????????localImagId.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc; ???????????}catch(e){ ???????????????alert("您上传的图片格式不正确,请重新选择!"); ???????????????return false; ???????????} ???????????imgObjPreview.style.display = ‘none‘; ???????????document.selection.empty(); ???????} ???} </script></body>
js 上传图片预览
原文地址:https://www.cnblogs.com/justSmile2/p/10034055.html