接受HTML5输入元素

Question

从Twitter保存图片时，使用Google Chrome（Chromium Issue 172529）时，这些图片有时会使用附加信息.jpg-large保存。

我想知道在通过input元素选择图像时是否仍然可以在文件资源管理器中选择这些图像？

我的输入元素是：

<input 
  accept="image/jpeg, image/png, image/bmp, image/gif"
  data-bind="file_select: upload_images" 
  multiple="multiple" 
  type="file"     
/>

我检查了image-large文件的MIME类型，它是image/jpeg：

因此浏览器应该能够在文件对话框中显示它，但实际上它是隐藏的：

有没有办法显示这个自定义文件扩展名？

Answer 1

根据HTML Living Standard by WHATWG（不要与W3C混淆）accept属性不限于MIME类型 - 它也会接受文件扩展名：

  

一个字符串，其第一个字符是U + 002E FULL STOP字符（。）
      表示接受具有指定文件扩展名的文件。

在你的情况下：

<input 
  accept="image/jpeg,image/png,image/bmp,image/gif,.jpg-large"
  data-bind="file_select: upload_images" 
  multiple="multiple" 
  type="file"     
/>

我自己使用它并且我可以告诉你所有主流浏览器都支持它，虽然用户界面不同（我特别发现Firefox的实现更清洁）。

请注意，OS文件选择器通常会按文件扩展名进行筛选，它不会检查实际文件内容以猜测MIME类型 - 至少在台式计算机上是这样。

Answer 2

我认为这不可行。 specification says that you can only define by MIME type。{{3}}。所以没有办法说，例如“* .JPEG-大”。

在理论中，操作系统应该知道文件类型，而不需要使用嗅探文件扩展名。

这就是它在Android上的运作方式。与.jpeg-large

一起使用时，可以选择使用accept="image/*"保存的文件