js实现上传图片选择图片后的预览功能

2017-06-07 08:10:36 前端技术共237人围观 1个不明物体

普通的上传图片选择图片后并不知道自己选择的什么图片，那么通过js我们可以做出预览效果，这样就知道选择的什么图片，以免误上传！



	<!DOCTYPE html>


	<html xmlns="http://www.w3.org/1999/xhtml">


	    <head>


	        <title>js上传图片--预览图片</title>


	        <meta http-equiv="content-type" content="text/html;charset=utf-8"/>


	    </head>


	     


	    <body>


	        <form>


	            <input type="file" onChange="preview(this)"/>


	            <img src="" id="previewimg" width="50px" height="40px"/>


	        </form>


	        <script type="text/javascript">


	            function preview(obj){


	                var img = document.getElementById("previewimg");


	                img.src = window.URL.createObjectURL(obj.files[0]);


	            }


	        </script>


	    </body>


	</html>