JavaScript使用FileReader读取本地文件内容

使用浏览器FileReader对象可以直接读取用户选择的文件内容.

在页面中定义一个file控件.

<input type="file" id="file"/>

在file控件改变时获取文件内容.

document.getElementById('file').addEventListener('change', function (event) {  
	var file = event.target.files[0];  
	if (file) {  
		var reader = new FileReader();  
		// readAsDataURL,函数是异步读取此函数会将内容转成Base64形式，适合图片文件内容展示
		reader.readAsDataURL(file);  
		// readAsText 函数是异步读取此函数会将内容以文本形式读取.
		reader.readAsText(file, "UTF-8");
		// 读取的函数都为异步，需要通过onload函数的回调来通知读取完成.
		reader.onload=function (evt) {  
			// 读取完成后reader对象的resul属性的值就是文件内容
			console.log(reader.result);
		};  	
		reader.onerror=function (evt) {  
			// 读取出错的时候处理
		}  
	}  
});