移动设备上的多部分表单:控制单击文件输入后显示的操作

Question

我有一个多部分表单，我希望用户将图像上传到我的网站。

<form method="POST" encType="multipart/form-data" action="/uploads" id="forminho">
    <div className="btn btn-success" id="submitFileBtn"> 
        Selecionar Imagem
        <input className="form-control2" type="file" name="upload" id="inputFile" onChange={this.submit}/>
    </div>
</form>

它在桌面上按预期工作，但在移动设备上，我得到了一个应用程序列表供您选择，这些应用程序与照片几乎没有关系。我得到：相机，摄像机，录音机和文档(并且没有选择其他操作的选项(。

如何明确表示我期待一个图像，并为此自定义此操作列表？

Answer 1

使用 HTML5，您可以检查上传的图像是否是具有<input> accept="image/*"标准的图像，如下所示：

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

这应该会自动阻止手机允许您选择随机应用程序。

记得在后端检查上传！ :)