HTML | DOM 输入文件上传类型属性

在 HTML 中，可以使用<input>元素来创建文件上传功能。通过指定不同的属性，可以定义上传文件的类型。其中，包含以下两种常用的类型属性：

1. accept 属性：用于确定可以上传的文件类型。
2. multiple 属性：用于允许一次选择多个文件上传。

下面将对这两种属性进行详细介绍。

1. accept 属性

accept 属性用于指定可以上传的文件类型，通过设置合适的 MIME 类型或文件扩展名来限制用户选择的文件类型。可以使用以下两种方式来设置 accept 属性的值：

• MIME 类型：使用 MIME 类型字符串来指定允许上传的文件类型。例如，image/jpeg 表示只允许上传 JPEG 文件，audio/* 表示允许上传任意音频文件。
• 文件扩展名：以点号（.）开头，指定允许上传的文件扩展名。例如，.jpg 表示只允许上传 JPEG 文件，.pdf 表示只允许上传 PDF 文件。

以下是一些常见的 MIME 类型和文件扩展名示例：

• MIME 类型示例：
  • image/*：所有图像类型。
  • audio/*：所有音频类型。
  • video/*：所有视频类型。
  • application/pdf：PDF 文件。
• 文件扩展名示例：
  • .jpg：JPEG 图像文件。
  • .png：PNG 图像文件。
  • .txt：文本文件。
  • .docx：Microsoft Word 文档。

示例代码：

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

上述代码将创建一个文件上传输入框，只允许上传图像类型的文件。

2. multiple 属性

multiple 属性用于允许一次选择多个文件进行上传。默认情况下，<input type="file"> 只允许选择单个文件进行上传。当设置 multiple 属性为 'multiple' 时，用户可以同时选择多个文件。

示例代码：

<input type="file" multiple>

上述代码将创建一个文件上传输入框，允许用户选择多个文件进行上传。

以上就是 HTML | DOM 输入文件上传类型属性的介绍。通过设置 accept 属性，可以限制用户上传的文件类型；通过设置 multiple 属性，可以允许用户选择多个文件进行上传。这些属性可以帮助开发者根据需求灵活控制文件上传功能的行为。