HTML、 input;、accept 属性-规定能够通过文件上传进行提交的文件类型
定义和用法
文章地址: http://www.w3school.com.cn/tags/att_input_accept.asp
accept 属性规定了可通过文件上传提交的服务器接受的文件类型。
注意:accept 属性仅适用于 <input type="file">。
提示:请不要将该属性作为您的验证工具。应该在服务器上对文件上传进行验证。
实例
规定在文件上传中服务器只接受图像文件:
<form>
<input type="file" name="pic" id="pic" accept="image/gif, image/jpeg" />
</form>
属性值
| 值 | 描述 |
|---|---|
| audio/* | 接受所有的声音文件。 |
| video/* | 接受所有的视频文件。 |
| image/* | 接受所有的图像文件。 |
| MIME_type | 一个有效的 MIME 类型,不带参数。请参阅 IANA MIME 类型,获得标准 MIME 类型的完整列表。 |
在上传文件的时候,需要限制指定的文件类型,accept这个属性,只在FF和chrome中有效。那么accept能限制哪些文件呢?见下表。
扩展名 MIME 描述
| *.3gpp | audio/3gpp, video/3gpp | 3GPP Audio/Video |
| *.ac3 | audio/ac3 | AC3 Audio |
| *.asf | allpication/vnd.ms-asf | Advanced Streaming Format |
| *.au | audio/basic | AU Audio |
| *.css | text/css | Cascading Style Sheets |
| *.csv | text/csv | Comma Separated Values |
| *.doc | application/msword | MS Word Document |
| *.dot | application/msword | MS Word Template |
| *.dtd | application/xml-dtd | Document Type Definition |
| *.dwg | image/vnd.dwg | AutoCAD Drawing Database |
| *.dxf | image/vnd.dxf | AutoCAD Drawing Interchange Format |
| *.gif | image/gif | Graphic Interchange Format |
| *.htm | text/html | HyperText Markup Language |
| *.html | text/html | HyperText Markup Language |
| *.jp2 | image/jp2 | JPEG-2000 |
| *.jpe | image/jpeg | JPEG |
| *.jpeg | image/jpeg | JPEG |
| *.jpg | image/jpeg | JPEG |
| *.js | text/javascript, application/javascript | JavaScript |
| *.json | application/json | JavaScript Object Notation |
| *.mp2 | audio/mpeg, video/mpeg | MPEG Audio/Video Stream, Layer II |
| *.mp3 | audio/mpeg | MPEG Audio Stream, Layer III |
| *.mp4 | audio/mp4, video/mp4 | MPEG-4 Audio/Video |
| *.mpeg | video/mpeg | MPEG Video Stream, Layer II |
| *.mpg | video/mpeg | MPEG Video Stream, Layer II |
| *.mpp | application/vnd.ms-project | MS Project Project |
| *.ogg | application/ogg, audio/ogg | Ogg Vorbis |
| application/pdf | Portable Document Format | |
| *.png | image/png | Portable Network Graphics |
| *.pot | application/vnd.ms-powerpoint | MS PowerPoint Template |
| *.pps | application/vnd.ms-powerpoint | MS PowerPoint Slideshow |
| *.ppt | application/vnd.ms-powerpoint | MS PowerPoint Presentation |
| *.rtf | application/rtf, text/rtf | Rich Text Format |
| *.svf | image/vnd.svf | Simple Vector Format |
| *.tif | image/tiff | Tagged Image Format File |
| *.tiff | image/tiff | Tagged Image Format File |
| *.txt | text/plain | Plain Text |
| *.wdb | application/vnd.ms-works | MS Works Database |
| *.wps | application/vnd.ms-works | Works Text Document |
| *.xhtml | application/xhtml+xml | Extensible HyperText Markup Language |
| *.xlc | application/vnd.ms-excel | MS Excel Chart |
| *.xlm | application/vnd.ms-excel | MS Excel Macro |
| *.xls | application/vnd.ms-excel | MS Excel Spreadsheet |
| *.xlt | application/vnd.ms-excel | MS Excel Template |
| *.xlw | application/vnd.ms-excel | MS Excel Workspace |
| *.xml | text/xml, application/xml | Extensible Markup Language |
| *.zip | application/zip | Compressed Archive |
实例 :
1.accept="image/gif, image/jpeg"
2.accept="application/msword"
3.accept="application/pdf"
4.accept="application/poscript"
5.accept="application/rtf"
6.accept="application/x-zip-compressed"
7.accept="audio/basic"
8.accept="audio/x-aiff"
9.accept="audio/x-mpeg"
10.accept="audio/x-pn/realaudio"
11.accept="audio/x-waw"
12.accept="image/gif"
13.accept="image/jpeg"
14.accept="image/tiff"
15.accept="image/x-ms-bmp"
16.accept="image/x-photo-cd"
17.accept="image/x-png"
18.accept="image/x-portablebitmap"
19.accept="image/x-portable-greymap"
20.accept="image/x-portable-pixmap"
21.accept="image/x-rgb"
22.accept="text/html"
23.accept="text/plain"
24.accept="video/quicktime"
25.accept="video/x-mpeg2"
26.accept="video/x-msvideo"
HTML、 input;、accept 属性-规定能够通过文件上传进行提交的文件类型的更多相关文章
- PHP实现单文件、多文件上传 封装 面向对象实现文件上传
文件上传配置 客户端配置 1.表单页面 2.表单的发送方式为post 3.添加enctype = "multipart/form-data" <form action=&qu ...
- SpringBoot - 实现文件上传2(多文件上传、常用上传参数配置)
在前文中我介绍了 Spring Boot 项目如何实现单文件上传,而多文件上传逻辑和单文件上传基本一致,下面通过样例进行演示. 多文件上传 1,代码编写 1)首先在 static 目录中创建一个 up ...
- php 文件上传后缀名与文件类型对照表(几乎涵盖所有文件)
网上有很多php文件上传的类,文件上传处理是php的一个特色(至少手册上是将此作为php特点来展示的,个人认为php在数组方面的优异功能更有特 色),学php的人都知道文件上传怎么做,但很多人在编程中 ...
- django设置并获取cookie/session,文件上传,ajax接收文件,post/get请求及跨域请求等的方法
django设置并获取cookie/session,文件上传,ajax接收文件等的方法: views.py文件: from django.shortcuts import render,HttpRes ...
- HTTP文件上传服务器-支持超大文件HTTP断点续传的实现办法
最近由于笔者所在的研发集团产品需要,需要支持高性能的大文件http上传,并且要求支持http断点续传.笔者在以前的博客如何实现支持大文件的高性能HTTP文件上传服务器已经介绍了实现大文件上传的一些基本 ...
- jspsmartupload 文件上传让input数据和文件上传同时提交
一.使用原因: 文件上传时,表单的属性中必须要有multipart/form-data,如以下例子: <form name="form_post" class="a ...
- sruts2:单个文件上传,多个文件上传(属性驱动)
文件上传功能在Struts2中得到了很好的封装,主要使用fileUpload上传组件. 1. 单个文件上传 1.1 创建上传单个文件的JSP页面.显示提交结果的JSP页面 uploadTest1.js ...
- 聊一聊jquery文件上传(支持多文件上传)
谈到文件上传,现在一般都用现成的组件可以使用.PC端的可以使用uploadify.针对微网站H5也有uploadifive.但是这组件并不能满足各种场景的需求,例如:预览 切图 放大缩小,取消之类的. ...
- vue原生文件上传,可以多文件上传
1.单文件上传 <template> <div> <label for="fileInput"> <i aria-hidden=" ...
- PHP设计的超强大的文件上传类(单文件上传)
form.html <!DOCTYPE html> <html> <head> <title>文件上传</title> </head& ...
随机推荐
- Java流程控制1
Scanner对象 java.util.Scanner 通过Scanner类来获取用户输入 next()和nextline()来获取输入的字符串,读取前我们一般需要使用hasnext()和hasnex ...
- web之jquery
jquery 插件 下载解压插件 加载jQuery 加载插件 插件样式 按照使用例子给元素添加类名,id,函数.
- 2003031126-石升福-Python数据分析-五一假期作业
项目 内容 班级链接 20级数据班(本) 作业链接 五一假期作业 博客名称 2003031126-石升福-Python数据分析-五一假期作业 要求 每道题要有题目,代码(使用插入代码,不会插入代码的自 ...
- RS485总线常用拓扑结构
RS485总线拓扑结构一般可分为以下4种,分别是:总线型拓扑结构.星型拓扑结构.树形拓扑结构.环形拓扑结构.根据RS485总线布线规范,只能按照总线拓扑结构布线,但是由于现场环境复杂多变,为了能够使整 ...
- CF1408
CF1408 那个博客搭好遥遥无期. A: 直接做就行了,我没智力还写 \(dp\) . #include<bits/stdc++.h> using namespace std; #def ...
- How to Apply WebLogic Server (WLS) Patches Using Smart Update
本文目的: 描述weblogic10.3.6及之前的版本,如何通过Smart Update打补丁 先决条件: You should download and apply the enhanced Sm ...
- 遇到 https://packetlife.net/
"I have never let my schooling interfere with my education." --Mark Twain
- gogetssl申请的域名证书私钥文件丢了,可以重新申请个吗?
因为gogetssl是不保存我们使用浏览器生成的KEY文件的,CSR文件倒是可以有办法再找到 也就是说Certificate Signing Request(CSR)可以想想办法,但是Your Pri ...
- 实验1.SDN拓扑实践
实验1:SDN拓扑实践 一.基本要求 (一)Mininet运行结果截图 (二) 使用Mininet的命令行生成如下拓扑: 1. 3台交换机,每个交换机连接1台主机,3台交换机连接成一条线. 2. 3台 ...
- Centos7安装nodejs(npm)
执行命令: 设置yum安装源> curl --silent --location https://rpm.nodesource.com/setup_14.x | sudo bash (14是大的 ...