1. 程式人生 > >javascript實現圖片上傳實時顯示上傳圖片

javascript實現圖片上傳實時顯示上傳圖片

我們平時會用到圖片上傳要求上傳的圖片要實時顯示,那麼下面就是我的方法

HTML程式碼如下

<input type="file" name="file" onchange="showImg(this)" />
<img id="showimg" src="" style="display:none;" />

JS程式碼如下

function showImg(thisimg) {
	var file = thisimg.files[0];
	if(window.FileReader) {
		var fr = new FileReader();
		
		var showimg = document.getElementById('showimg');
		fr.onloadend = function(e) {
		showimg.src = e.target.result;
	};
	fr.readAsDataURL(file);
	showimg.style.display = 'block';
	}
}

原文地址:https://www.codelovers.cn/article/20181025145109.html