javascript预览上传的本地图片

 

<form  id="myForm" runat="server">     <div>     <input type="file" name="updFile" id="updFile" οnchange="Change()"/>     </div>     <div id="imgFiles"></div>     <script type="text/javascript">         function Change() {

            var x = document.getElementById("updFile");             var imgAll = document.getElementById("imgFiles");                         if (!x || !x.value) return;             var patn = /\.jpg$|\.jpeg$|\.gif$/i;             if (patn.test(x.value)) {                 var y = document.getElementById(x.value);                 //判断原图片是否存在，如果存在，则不加载进来                 if (y) return                 var newFileName = document.getElementById("updFile").value;                 var imgHtml = "<div><h1 id=\"" + newFileName + "\" style=\"border: 1px solid black; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=image);width: 100px; height: 100px\"></h1><INPUT type=\"button\"  NAME=\"Delete\" value=\"删除\" οnclick=\"delFile(this)\"></div>";                 var objFiles = document.getElementById("imgFiles");                 document.getElementById('imgFiles').insertAdjacentHTML("beforeEnd", imgHtml)

                document.getElementById(newFileName).filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = newFileName;                 document.getElementById(newFileName).style.width = document.getElementById(newFileName).offsetWidth;                 document.getElementById(newFileName).style.height = document.getElementById(newFileName).offsetHeight;                 document.getElementById(newFileName).filters.item("DXImageTransform.Microsoft.AlphaImageLoader").sizingMethod = "scale";             }             else {                 alert("您选择的似乎不是图像文件。");             }

        }         function delFile(obj) {             obj.parentElement.removeNode(true);         }         </script> </form>

转载于:https://www.cnblogs.com/bbqqqbq/archive/2008/12/30/1365431.html

相关资源：Javascript图片上传前的本地预览实例