从HTML文件输入中删除“所有文件”选项

Question

我正在使用<input type="file">来上传音频文件。

为了实现这个目的，我使用了accept="audio/*"。因此，浏览器的文件选择对话框默认只显示音频文件。但是，该对话框中有一个名为“所有文件”的选项，我不想要它。

（注意-任何JavaScript，jQuery和AngularJs的解决方案也欢迎）

如何禁用/删除“所有文件”选项？

- Aditya Ponkshe

Answer 1

我认为这超出了浏览器的范畴，更多取决于操作系统。然而，无论情况如何，我认为这不是你应该轻易操作的东西。

accept的支持不是很好（虽然可能不是问题），但是您可以在这里看到： http://www.iana.org/assignments/media-types/media-types.xhtml#audio 允许使用的类型数量可能已经超出了您的应用程序范畴。最好的做法是执行服务器端验证，将accept纯粹用作客户端指示器。

此外，虽然这是一个旧答案，但我认为它仍然相关和有效： File input 'accept' attribute - is it useful?

- Matt Way

---

那么我的结论是，我不能禁用“所有文件”吗？ - Aditya Ponkshe

好的，我的翻译是：“没错，但更重要的答案是你不应该这样做。” - Matt Way

完全正确：这是一种可用性改进，而不是验证，也不是安全功能。因此我真的没有看到任何问题。 - alexander farkas

Answer 2

现在使用文件系统访问API中的window.showOpenFilePicker可以实现。唯一的问题是它只在2020年10月以后的Chrome版本中可用。

  const files = await window.showOpenFilePicker({     
    
    types: [
          {
            description: 'Audio Files',
            accept: {
              'audio/*': ['.mp3','.wav'],//Extensions you want to allow
            },
          },
        ],
        excludeAcceptAllOption: true, // this hides all files option
        multiple: false,
});

API规范: https://developer.mozilla.org/zh-CN/docs/Web/API/File_System_Access_API

注意: 这不是标准轨迹上的内容。

- viresh