<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta charset="utf-8" /> <meta name="referrer" content="never"> <title>直接预览本地图片,支持 IE8</title> </head> <body> <h2>JavaScript 直接预览本地图片,支持 IE8</h2> <input type="file" onchange="PreImg(this, 'divPre','imgPre');" /> <div id="divPre" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale);width:300px; height:300px;margin-top:10px;"> <img id="imgPre" src="/favicon.svg" style="width:100%; height:100%;" /> </div> </body> </html>
function PreImg(file, divId, imgId) { var exts = ".jpg .jpeg .gif .png .bmp", ext = file.value.substring(file.value.lastIndexOf('.'), file.value.length).toLowerCase(); if (exts.indexOf(ext) == -1) { if (file.outerHTML) { file.outerHTML = file.outerHTML; } else { file.value = ""; } alert("只能上传 jpg gif png bmp 格式图片"); } else { var divs = document.getElementById(divId), imgs = document.getElementById(imgId); if (divs.filters) { imgs.style.display = "none"; file.select(); divs.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = document.selection.createRange().text; } else { imgs.src = window.URL.createObjectURL(file.files.item(0)); } } }