File,FileReader和Ajax文件上傳實例分析(php)_javascript技巧

來源：懂視網責編：小采時間：2020-11-27 20:59:05

File,FileReader和Ajax文件上傳實例分析(php)_javascript技巧

File,FileReader和Ajax文件上傳實例分析(php)_javascript技巧:File FileReader 可以干什么？ Ajax文件上傳例子 FileReader 對象可以讀取文件的 Base64編碼數據（readAsDataURL），2進制字符串（readAsBinaryString），文本（readAsText）并且都是異步的。對了，Email拖拽附件上傳就可以利用 FileReade

推薦度：

點擊下載本文 文檔為doc格式

導讀File,FileReader和Ajax文件上傳實例分析(php)_javascript技巧:File FileReader 可以干什么？ Ajax文件上傳例子 FileReader 對象可以讀取文件的 Base64編碼數據（readAsDataURL），2進制字符串（readAsBinaryString），文本（readAsText）并且都是異步的。對了，Email拖拽附件上傳就可以利用 FileReade

File FileReader 可以干什么？
Ajax文件上傳例子
FileReader 對象可以讀取文件的 Base64編碼數據（readAsDataURL），2進制字符串（readAsBinaryString），文本（readAsText）并且都是異步的。
對了，Email拖拽附件上傳就可以利用 FileReader 配合 Ajax 完成。

File 對象
File對象可以從 input[type=file].files 數組，和拖拽事件 event.dataTransfer.files 中獲取到。
第一張圖是 Chrome 下的 File 對象，第2個圖是Firefox下的File對象。Firefox下會多幾個方法，注意這里的讀取數據方法是同步的。

FileReader 對象
這是用來讀取文件數據的（并且是異步的）。下面是一個簡單的代碼（file對象用上面的方法取得）
代碼如下:
var fileReader = new FileReader();
fileReader.onloadend = function(){
console.log(this.readyState); // 這個時候應該是 2
console.log(this.result); 讀取完成回調函數，數據保存在result中
}
fileReader.readAsBinaryString(file);// 開始讀取2進制數據異步參數為file 對象
//fileReader.readAsDataURL(file); // 讀取Base64
//fileReader.readAsText(file);//讀取文本信息

可以運行下面簡單的例子（chrome 和 firefox 有效）
代碼如下:

html5 File and FileReader