文件上傳input 屬性
<input name="myFile" change="toBase64($event) type="file">
對應事件:change
常用屬性:accept, multiple, capture
accept:限制文件類型
audio/* 表示所有音頻文件 HTML5(支持)
video/* 表示視頻文件 HTML5(支持)
image/* 表示圖片文件 HTML5(支持)
支持逗號分隔的 MIME 類型字符串,寫可以寫成如下的方式:
accept="image/png" 或者 accept=".png" ,只接受 png 圖片。
accept="image/png, image/jpeg" 或者 accept=".png, .jpg, .jpeg" ,接受 PNG 和 JPEG 文件。
accept="image/*" ,接受任何圖片文件類型。
multiple(多選):
multiple 屬性:當用戶所在的平台允許使用 Shift 或者 Contro鍵時,用戶可以選擇多個文件。
如果不希望多選,可以直接忽略 multiple 屬性。
capture(調用設備媒體):
capture 屬性:在webapp上使用 input 的 file 屬性,指定 capture 屬性可以調用系統默認相機、攝像和錄音功能。
capture表示,可以捕獲到系統默認設備的媒體信息,如下:
capture="camera" 相機
capture="camcorder" 攝像機
capture="microphone" 錄音
文件類型限制可選項:
For CSV files (.csv), use:
<input type="file" accept=".csv" />
For Excel Files 2003-2007 (.xls), use:
<input type="file" accept="application/vnd.ms-excel" />
For Excel Files 2010 (.xlsx), use:
<input type="file" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" />
For Text Files (.txt) use:
<input type="file" accept="text/plain" />
For Image Files (.png/.jpg/etc), use:
<input type="file" accept="image/*" />
For HTML Files (.htm,.html), use:
<input type="file" accept="text/html" />
For Video Files (.avi, .mpg, .mpeg, .mp4), use:
<input type="file" accept="video/*" />
For Audio Files (.mp3, .wav, etc), use:
<input type="file" accept="audio/*" />
For PDF Files, use:
<input type="file" accept=".pdf" />