上传一张图片并实现预览功能

function showPreview(source){
		var files = source.files[0];
		console.log("files:"+files);
		if(window.FileReader){
			//FileReader接口提供了读取文件的方法和包含读取结果的事件模型。
			var fr = new FileReader();
			console.log(fr);
			fr.onload = function (e){
				document.getElementById("portrait").src = e.target.result;
				console.log(e.target);
			}
			fr.readAsDataURL(files);
		}else{
			alert(浏览器不支持);
		}
	}

<input type="file" name="file" id="file" onchange="showPreview(this)"/>
<img src="" alt="" id="portrait"/>

原文地址:https://www.cnblogs.com/dyy-dida/p/9466470.html