JS实现图片文件上传预览

  1. <!DOCTYPE html>  
  2. <html xmlns="http://www.w3.org/1999/xhtml">  
  3.     <head>  
  4.         <title>js上传图片--预览图片</title>  
  5.         <meta http-equiv="content-type" content="text/html;charset=utf-8"/>  
  6.     </head>  
  7.        
  8.     <body>  
  9.         <form>  
  10.             <input type="file" onChange="preview(this)"/>  
  11.             <img src="" id="previewimg" width="50px" height="40px"/>  
  12.         </form>  
  13.         <script type="text/javascript">  
  14.             function preview(obj){  
  15.                 var img = document.getElementById("previewimg");  
  16.                 img.src = window.URL.createObjectURL(obj.files[0]);  
  17.             }  
  18.         </script>  
  19.     </body>  
  20. </html>
posted @ 2018-04-25 10:51  冉青枫  阅读(204)  评论(0)    收藏  举报