From 218934fa2ed1c702a6d3923d2aa2cc6b43c48684 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:43:23 -0500 Subject: initial commit --- files/zh-tw/web/api/filereader/index.html | 213 ++++++++++++++++++++++++++++++ 1 file changed, 213 insertions(+) create mode 100644 files/zh-tw/web/api/filereader/index.html (limited to 'files/zh-tw/web/api/filereader/index.html') diff --git a/files/zh-tw/web/api/filereader/index.html b/files/zh-tw/web/api/filereader/index.html new file mode 100644 index 0000000000..4b80e334a4 --- /dev/null +++ b/files/zh-tw/web/api/filereader/index.html @@ -0,0 +1,213 @@ +--- +title: FileReader +slug: Web/API/FileReader +tags: + - API + - File API + - Files + - Interface + - Reference +translation_of: Web/API/FileReader +--- +
{{APIRef("File API")}}
+ +

藉由 FileReader 物件，Web 應用程式能以非同步（asynchronously）方式讀取儲存在用戶端的檔案（或原始資料暫存）內容，可以使用 {{domxref("File")}} 或 {{domxref("Blob")}} 物件指定要讀取的資料。

+ +

File 物件可以從使用者於 {{HTMLElement("input")}} 元素選擇之檔案所回傳的 {{domxref("FileList")}} 物件當中取得，或是來自拖放操作所產生的 {{domxref("DataTransfer")}} 物件之中，也能由 {{domxref("HTMLCanvasElement")}} 物件（元素物件）執行 mozGetAsFile() 方法後回傳。

+ +

{{AvailableInWorkers}}

+ +

建構式

+ +
+
{{domxref("FileReader.FileReader", "FileReader()")}}
+
建立新的 FileReader 物件。
+
+ +

請參考在網頁應用程式中使用本地檔案的更多細節與範例。

+ +

屬性

+ +
+
{{domxref("FileReader.error")}} {{readonlyinline}}
+
此 {{domxref("DOMException")}} 類型的物件記錄了讀取資料時發生的錯誤資訊。
+
{{domxref("FileReader.readyState")}} {{readonlyinline}}
+
表示目前 FileReader 狀態的數字，其代表的意義為： + + + + + + + + + + + + + + + + + + +
EMPTY0尚未讀入任何資料。
LOADING1正在讀入資料。
DONE2完成資料讀取。
+
+
{{domxref("FileReader.result")}} {{readonlyinline}}
+
讀入的資料內容。只有在讀取完成之後此屬性才有效，而資料的格式則取決於是由哪一個方法進行讀取。
+
+ +

事件處理器

+ +
+
{{domxref("FileReader.onabort")}}
+
{{event("abort")}} 事件處理器，於讀取被中斷時觸發。
+
{{domxref("FileReader.onerror")}}
+
{{event("error")}} 事件處理器，於讀取發生錯誤時觸發。
+
{{domxref("FileReader.onload")}}
+
{{event("load")}} 事件處理器，於讀取完成時觸發。
+
{{domxref("FileReader.onloadstart")}}
+
{{event("loadstart")}} 事件處理器，於讀取開始時觸發。
+
{{domxref("FileReader.onloadend")}}
+
{{event("loadend")}} 事件處理器，於每一次讀取結束之後觸發（不論成功或失敗），會於 onload 或 onerror 事件處理器之後才執行。
+
{{domxref("FileReader.onprogress")}}
+
{{event("progress")}} 事件處理器，於讀取 {{domxref("Blob")}} 內容時觸發。
+
+ +
+

FileReader 物件繼承自 {{domxref("EventTarget")}}，其所有的事件也都能夠透過 {{domxref("EventTarget.addEventListener()","addEventListener")}} 方法來註冊事件監聽器。

+
+ +

方法

+ +
+
{{domxref("FileReader.abort()")}}
+
中斷目前的讀取，此方法回傳後屬性 readyState 將會是 DONE。
+
{{domxref("FileReader.readAsArrayBuffer()")}} {{gecko_minversion_inline("7.0")}}
+
開始讀取指定的 {{domxref("Blob")}}，讀取完成後屬性 result 將以 {{domxref("ArrayBuffer")}} 物件來表示讀入的資料內容。
+
{{domxref("FileReader.readAsBinaryString()")}} {{non-standard_inline}}
+
開始讀取指定的 {{domxref("Blob")}}，讀取完成後屬性 result 將以字串型式來表示讀入的原始二進位資料（raw binary data）。
+
{{domxref("FileReader.readAsDataURL()")}}
+
開始讀取指定的 {{domxref("Blob")}}，讀取完成後屬性 result 將以 data: URL 格式（base64 編碼）的字串來表示讀入的資料內容。
+
{{domxref("FileReader.readAsText()")}}
+
開始讀取指定的 {{domxref("Blob")}}，讀取完成後屬性 result 將以文字字串型式來表示讀入的資料內容。
+
+ +

規範

+ + + + + + + + + + + + + + +
規範狀態註解
{{SpecName("File API", "#dfn-filereader", "FileReader")}}{{Spec2("File API")}}Initial definition
+ +

瀏覽器相容性

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
功能Firefox (Gecko)ChromeEdgeInternet ExplorerOperaSafari
基本支援{{CompatGeckoDesktop("1.9.2")}}[1]7{{CompatVersionUnknown}}10[2]12.02[2]6.0
在 Web Workers 的支援{{CompatGeckoDesktop(46)}}{{CompatVersionUnknown()}}{{CompatVersionUnknown}}{{CompatNo}}{{CompatVersionUnknown()}}{{CompatNo}}
error property uses {{domxref("DOMException")}}, not {{domxref("DOMError")}}{{CompatGeckoDesktop(58)}}{{CompatVersionUnknown()}}{{CompatVersionUnknown()}}{{CompatNo}}{{CompatVersionUnknown()}}{{CompatNo}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
功能Firefox Mobile (Gecko)AndroidEdgeIE MobileOpera MobileSafari Mobile
基本支援323{{CompatVersionUnknown}}1011.56.1
在 Web Workers 的支援{{CompatGeckoMobile(46)}}{{CompatVersionUnknown()}}{{CompatVersionUnknown}}{{CompatNo}}{{CompatVersionUnknown()}}{{CompatNo}}
error property uses {{domxref("DOMException")}}, not {{domxref("DOMError")}}{{CompatGeckoMobile(58)}}{{CompatUnknown()}}{{CompatVersionUnknown()}}{{CompatNo}}{{CompatVersionUnknown()}}{{CompatNo}}
+
+ +

[1] 在 Gecko 2.0 beta 7 (Firefox 4.0 beta 7) 以前，所有的 {{domxref("Blob")}} 參數都屬於 {{domxref("File")}} 參數；之後為了更符合規範，所以更新了這個特徵。在 Gecko 13.0 {{geckoRelease("13.0")}} 以前，FileReader.error 屬性回傳了 {{domxref("FileError")}} 物件。這個介面之後被移除、而 FileReader.error 目前會回傳 {{domxref("DOMError")}} 並定義為 FileAPI draft。

+ +

[2] Opera 在 11.1 有限度支援。

+ +

參見

+ + -- cgit v1.2.3-54-g00ecf