需要用到图片上传前的预览效果
找了好久......
http://www.uploadify.com/download/
http://www.cnblogs.com/boychenney/archive/2011/10/08/2203036.html
http://www.cnblogs.com/oec2003/archive/2010/01/06/1640027.html
http://www.cnblogs.com/cloudgamer/archive/2009/12/22/ImagePreview.html
http://hi.baidu.com/%B7%E7%BE%B0%D2%BB%C2%B7%C3%C0%BA%C3/blog/item/5729103b79e5c4ccd56225ab.html
浏览器的兼容是个很大的问题
以下ie8,测试通过,但是ff,chrome不行
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> </head> <body> <form action="" method="post" enctype="multipart/form-data" name="form1"> <input name="attach" type="file" onchange="javascript:ShowImg(this.value);" onKeyDown="javascript:return(false);" size="20"> <script language="JavaScript"> function ShowImg(src) { document.getElementById("imgDiv").innerHTML="图片预览:<br><img id='imgObj' onload='javascript:GetSize()' src='file:///" + src + "'>"; } function GetSize() { var width,height; var imgObj=document.getElementById("imgObj"); width=imgObj.width; height=imgObj.height; document.getElementById("err_msg").innerHTML="图片大小(宽×高):<font color=red>" + width + "×" + height + "</font>"; if(width>164){ imgObj.width=164; imgObj.height=imgObj.height/(imgObj.width/164); } } /* function GetError() { document.getElementById("err_msg").innerHTML="图片大小(宽×高):<font color=red>NaN</font>"; //document.getElementById("imgDiv").innerHTML=""; //document.getElementById("err_msg").innerHTML="图片文件不存在或格式错误!" } */ </script> <div id="imgDiv" align="center"></div> <div id="err_msg" align="center"></div> </form> </body> </html>