上传图片前浏览图片

转载于 2014-07-15 21:04:00 发布 · 67 阅读

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/zhangshiwen/p/3847403.html

文章标签：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <script type="text/javascript">

  </script>
 </head>

 <body>
  <form name="form4" id="form4" method="post" action="#"> 
	  <input type="file" name="file4" id="file4"  onchange="preview4()" />
	  <img id="pic4" src="" alt="图片在此显示" width="120"/>
  </form>
  <script type="text/javascript">
  function preview4(){     
	  var x = document.getElementById("file4");     
	  var y = document.getElementById("pic4");     
	  if(!x || !x.value || !y)            return;      
	  var patn = /\.jpg$|\.jpeg$|\.gif$/i;     
	  if(patn.test(x.value)){              
	  y.src = "file://localhost/" + x.value; 
  }else{  
	alert("您选择的似乎不是图像文件。"); 
  }
  }
  </script>
 </body>
</html>

转载于:https://www.cnblogs.com/zhangshiwen/p/3847403.html