最近在做一個H5的項目,里邊涉及到拍照上傳圖片的功能以及識別圖片的功能,這里對識別圖片的功能不做贅述,不屬本文范疇。我在做完并上線項目后,同事跟我提了一個要求是可不可以同時選擇多張圖片上傳,我做的時候的想法是如果給file表單加了 multiple 屬性就沒有辦法調(diào)用手機的攝像頭拍照了,如果不加,就無法同時選擇多張圖片,于是我就照實跟同事說了這個情況。但回頭一想,單張圖片可以上傳,那多張圖片呢?于是就有了本文的內(nèi)容。
HTML5定義了 FileReader 作為文件 API 的重要成員用于讀取文件,根據(jù) W3C 的定義,F(xiàn)ileReader接口提供了讀取文件的方法和包含讀取結(jié)果的事件模型。
FileReader的實例擁有 4 個方法,其中 3 個用以讀取文件,另一個用來中斷讀取。下面的表格列出了這些方法以及他們的參數(shù)和功能,需要注意的是 ,無論讀取成功或失敗,方法并不會返回讀取結(jié)果,這一結(jié)果存儲在 result 屬性中。
方法名 | 參數(shù) | 描述 |
---|---|---|
abort | none | 中斷讀取 |
readAsBinaryString | file | 將文件讀取為二進制碼 |
readAsDataURL | file | 將文件讀取為 DataURL |
readAsText | file, [encoding] | 將文件讀取為文本 |
網(wǎng)友評論