上传文件要用到 <input type="file">
,这个元素有个 accept
属性,可以用来筛选文件类型,方便用户选择。按照 MDN 的说法,这个属性的值支持以下几种形式:
- 合法的文件扩展名,大小写不敏感,以
.
作为开头,比如.jpg
,.pdf
- 合法的 MIME type,不需要扩展名
- 媒体文件,
audio/*
适配任意声音文件,video/*
适配任意视频,image/*
适配任意图片
同时,属性值可以使用 ,
连接,表示“或”的意思。注意,这里只能是单独的 ,
,不能有空格,不然有空格的部分会失效。所以,比如,一个上传图片、以及 PDF 的元素就可以写成:
<input type="file" accept="image/*,.pdf">
使用扩展名比较方便,但是扩展名太多不方便管理,比如 .jpg
和 .jpeg
,容易漏掉,所以我更喜欢 MIME type。那么压缩文件的 MIME type 是什么呢?经过一番搜索和尝试,是:.zip,.rar,application/x-rar-compressed,application/zip,application/x-zip-compressed,application/octet-stream
。
欢迎吐槽,共同进步