如何在HTML表单中允许多个文件上传

百变鹏仔 3个月前 (09-22) #HTML

文章标签多个

In this article, we will learn how to allow multiple files uploads in HTML forms.

我们使用多个属性，以允许在HTML表单中进行多个文件上传。多个属性适用于电子邮件和文件输入类型。

If you want to allow a user to upload the file to your website, you need to use a file upload box, also known as a file, select box. This is created using the element and the type of attribute is set to file.

语法

以下是在HTML表单中选择多个文件上传的语法。

立即学习“前端免费学习笔记（深入）”；

<input type="file" name="name" multiple>

示例（使用多个属性）

以下是HTML表单中选择多个文件上传的示例程序。

<!DOCTYPE html><html><head>   <title>Upload multiple files</title>   <meta charset="UTF-8">   <meta http-equiv="X-UA-Compatible" content="IE=edge">   <meta name="viewport" content="width=device-width, initial-scale=1.0"></head><body>   <form>      <input type="file" name="name" multiple><br><br>      <br>      <input type="submit" value="Submit">   </form></body></html>

以下是上述示例程序的输出，其中在输入字段中未选择任何文件。

We have chosen only one file in the input field. Below is the output shows the file, we have chosen.

我们也可以选择尽可能多的文件。下面的输出显示我们选择的文件数量。

Using ‘multiple’ Attribute with Values of Multiple Files

The below syntax work same as the above-mentioned syntax. We assign ‘multiple’ attribute with the value of multiple for selecting multiple files in the input field.

语法

以下是在HTML表单中选择多个文件上传的语法。

立即学习“前端免费学习笔记（深入）”；

<input type="file" name="name" multiple=>

Example

的中文翻译为：

示例

以下是在HTML表单中选择多个文件上传的示例程序。

<!DOCTYPE html><html><head>   <title>Upload multiple files</title>   <meta charset="UTF-8">   <meta http-equiv="X-UA-Compatible" content="IE=edge">   <meta name="viewport" content="width=device-width, initial-scale=1.0"></head><body>   <form>      <input type="file" name="name" multiple="multiple"><br><br>      <br>      <input type="submit" value="Submit">   </form></body></html>

正如我们在输出中看到的，我们已经选择了四个文件进行上传。

文章推荐

如何在HTML表单中允许多个文件上传

语法

示例（使用多个属性）

Using ‘multiple’ Attribute with Values of Multiple Files

语法

Example

示例

html代码是什么

值得一学的6个前端HTML+CSS特效

html怎么设置字体

怎么隐藏html标签

html怎么设置编码utf8