水平有限，仅供参考。已测试谷歌、火狐
<html xmlns="http://www.w3.org/<a href="http://www.cxyclub.cn/Tag/1999.html" target="_blank">1999</a>/xhtml"> <head> <title>本地图片预览代码</title> <style type="text/css"> #preImgDiv { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale); } </style> <script type="text/<a href="http://www.cxyclub.cn/Tag/javascript.html" target="_blank">javascript</a>"> <a href="http://www.cxyclub.cn/Tag/function.html" target="_blank">function</a> preView(obj) { var preDiv = document.getElementById("preImgDiv");//图片所在div var imgHeight = preDiv.style.height || 150; var imgWidth = preDiv.style.width || 150; if (window.navigator.userAgent.indexOf("MSIE") > 0) { //ie浏览器 preDiv.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = obj.value; // newPreview.style.width = imgWidth; // newPreview.style.height = imgHeight; } else { //其他浏览器 已测试谷歌、火狐 var txt = " <img id='imgpre' height='" + imgHeight + "' width='" + imgWidth + "' />"; preDiv.innerHTML = txt; var file = obj.<a href="http://www.cxyclub.cn/Tag/files.html" target="_blank">files</a>[0]; var reader = new FileReader(); reader.onload = function (e) { document.getElementById("imgpre").setAttribute("src", e.target.result) } reader.readAsDataURL(file); } } </script> </head> <body> 请选择图片：<br /> <br /> <div style="height: 150px; width: 150px; border: 1px solid black" id="preImgDiv"> </div> <input type="file" onchange='preView(this)' /> </body> </html>
相关文章
