如何确保你的输入栏只能上传图片

85 阅读1分钟

我需要有一个图片的文件上传,所以我添加了我的小input type="file" 字段。

<input type="file">

我只希望图片能被允许由浏览器上传。

这是很常见的事情,但我总是忘记怎么做。

使用accept 属性,并通过image/* 来允许所有的图像。

<input type="file" accept="image/*">

或者image/png ,只接受PNG图片。

<input type="file" accept="image/png">

同样的语法可以做到只接受视频。

<input type="file" accept="video/*">

或音频。

<input type="file" accept="audio/*">

或者是它们的组合。

<input type="file" accept="image/*,audio/*,video/*">

哦,常见的事情--添加multiple ,允许上传多个。

<input type="file" multiple accept="image/*">

当然这只是客户端的验证,当你收到文件时,你也应该在服务器上验证mime类型。

下载我的免费HTML手册!