HTML - accept 属性

HTML accept 属性用于定义服务器将接受的文件类型（通过文件上传提交）。

它接受以逗号分隔的一个或多个文件类型或唯一文件类型说明符（即图像、音频、视频、文档等）的形式的值。请勿使用此属性来验证表单，因为应在服务器上验证文件上传。

HTML accept 属性只能与 <input type=“file”>标签一起使用，在 HTML5 中不受支持。

语法


<input type = "file" accept = "value" />

适用于

下面列出的元素允许使用 HTML accept 属性。

元素	描述
<input>	HTML <input> 标签用于指定输入字段。

HTML accept 属性的示例

您可以在表单的输入字段中使用以下 accept 属性示例来演示用户如何根据指定类型上传文件。

指定服务器接受的文件

Accept 属性可用于指定用户可以选择的文件扩展名，如 .jpg、.png .pdf。


<!DOCTYPE html>
<html lang="en">

<head>
	 <title>
			Specifying Files that Server Accept
	 </title>
</head>

<body>
	 <h2>
			Accepting only image files with 
			specific extensions
	 </h2>
	 <form>
			<label for="images">
				 Select an image file (.jpg, .jpeg, .png, .gif):
			</label>
			<input type="file"
						id="images"
						name="images"
						accept=".jpg, .jpeg, .png, .gif">
			<br><br>
			<input type="submit" value="Submit">
	 </form>
</body>

</html>

仅接受音频/视频文件

Accept 属性可用于指定用户可以选择所有扩展的音频、视频或图像


<!DOCTYPE html>
<html>

<head>
	 <title>Accepting audio/video file only</title>
</head>

<body>
	 <h1>Accepting audio/video file only</h1>
	 <form>
			<!-- Accepting all audio files -->
			<label for="audio">
				 Select an audio file:
			</label>
			<input type="file"
						id="audio"
						name="audio"
						accept="audio/*">
			<br><br>

			<!-- Accepting all video files -->
			<label for="video">
				 Select a video file:
			</label>
			<input type="file"
						id="video"
						name="video"
						accept="video/*">
			<br><br>
			<input type="submit" value="Submit">
	 </form>
</body>

</html>

仅接受图像文件

Accept 属性可用于选择具有任何扩展名的图像


<!DOCTYPE html>
<html>

<head>
			<title>
				 Accept Attribute to select all image types
			</title>
</head>

<body>
	 <h1>
			Accept Attribute to select all image types
	 </h1>
	 <form>
			<!-- Accepting all image files -->
			<label for="image">
				 Select an image file:
			</label>
			<input type="file"
						id="image"
						name="image"
						accept="image/*">
			<br><br>
			<input type="submit" value="Submit">
	 </form>
</body>

</html>

支持的浏览器

浏览器
是否支持	8.0	10.0	4.0	6.0	15.0

打印本页