FileReader接口的方法
FileReader接口有4個方法衫哥，其中3個用來讀取本地文件圃伶，另一個用來中斷讀取。無論讀取成功或失敗毙芜，方法并不會返回讀取結果忽媒，這一結果存儲在result屬性中。
FileReader接口的方法
| 方法名 | 參數(shù) | 描述 |
|---|---|---|
| readAsBinaryString | file | 將文件讀取為二進制編碼 |
| readAsText | file,[encoding] | 將文件讀取為文本 |
| readAsDataURL | file | 將文件讀取為DataURL |
| abort | (none) | 終端讀取操作 |
讀取上傳的文件的尺寸以及大小
demo地址
html
<input type="file" onchange="previewFile(this)">
js
function previewFile(targetInput){
console.log(targetInput.files[0].size / (1024*2)+'M=================>')
console.log(targetInput.value)
var reader = new FileReader();
reader.addEventListener("load", function () {
//加載圖片獲取圖片真實寬度和高度
var image = new Image();
image.onload=function(event){
var width = image.width;
var height = image.height;
console.log(event)
console.log(width)
console.log(height)
};
image.src= reader.result;
}, false);
reader.readAsDataURL(targetInput.files[0]);
}
