`
xinklabi
  • 浏览: 1562997 次
  • 性别: Icon_minigender_1
  • 来自: 吉林
文章分类
社区版块
存档分类
最新评论

input type=file accept中可以限制的文件类型

 
阅读更多

在上传文件的时候,需要限制指定的文件类型,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
*.pdf 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 aplication/zip Compressed Archive
分享到:
评论

相关推荐

    vue中使用input[type=”file”]实现文件上传功能

    input[type=file] 标签中的属性accept=application/msword,application/pdf 在pc上正常,但是在手机ios和android上这个文件格式限制会被忽略,所以需要在js中增加格式的判断,以及对应显示样式的设置.(我也是刚发现,...

    HTML input file控件限制上传文件类型_动力节点Java学院整理

    input id="File1" type="file" accept=".xls,.doc,.txt,.pdf" /> 这样选择的时候默认会显示为这样: 文件选择框内只显示出你自定义文件类型的文件,也还比较方便。 不过这只是最简单的掩人耳目的做法,还是能...

    vue实现移动端input上传视频、音频

    vue移动端input上传视频、音频,供大家参考,具体内容如下 ... <div class=title>现场视频 <div class=upLoad> ... id=pop_video type=file accept=video/* capture=camcorder v-on:change=getVideo

    testUploadFile.html

    它可以限制上传的文件类型 当然你也可以写成 accept="image/*"--> <input type="file" id="myimg" onchange="imgChange(this)" accept="image/png,image/gif,image/jpeg"/> function imgChange(img) ...

    Vue触发隐藏input file的方法实例详解

    1、使用input透明覆盖法  将input的z-index设置为1以上的...input type=file @change=picUpload($event) accept=image/* /> .uploadImg { width: 100%; height: 1.46rem; position: relative; input { widt

    HTML5新特性之type=file文件上传功能

    (2)accept:服务器接受的文件类型,否则将被忽略。 音频/ *代表声音文件。仅HTML5支持 视频/ *代表视频文件。仅HTML5支持 图像/ *表示图像文件。仅HTML5支持 (3)required:此属性指定用户在提交表单之前必须填写...

    vue excel上传预览和table内容下载到excel文件中

    input type=file d=file_input @change=importf(this) accept=.csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel /> <div click=fileBtn>上传到服务器 <e

    vue axios 表单提交上传图片的实例

    项目中用的element 的框架,然后在项目有一个添加数据...input class=file name=file type=file accept=image/png,image/gif,image/jpeg @change=update/> let file = e.target.files[0]; let param = new Form

    jQuery实现input[type=file]多图预览上传删除等功能

    下面我们了解一下,多图上传时...input id=upload type=file accept=image/* multiple=multiple> <button class=btn>点击上传</button> <div class=img-box> <!-- 存放预览图片 --> </div>

    android 之 webView 显示h5 执行选择图片或者拍照功能

    <input accept="image/*" capture="camera" id="imgFile" name="imgFile" type="file"> 用安卓的 webView 控件来显示h5网页 然后给webView 设置WebChromeClient WebChromeClient 主要处理解析,渲染网页等浏览器做...

    自写上传图片并页面上预显demo

    通过ajaxSubmit和uploadPreview实现图片上传并且在页面上显示,jdk1.8,可运行

    JavaScript判断文件上传类型的方法

    input id="imageFile" name="imageFile1" accept="image/jpg,image/jpeg,image/png,image/bmp,image/gif" type="file" title="点击选择文件" onchange="imageSubmit(this,0);"/> 选中图片后立即触发onchange...

    H5调用相机拍照并压缩图片的实例代码

    整理文档,搜刮出一个H5调用相机拍照并压缩图片的实例代码,稍微整理精简一下做下分享。 背景 最近要做一个h5的页面,主要功能就是调用相机拍照或者是相册选图并且把照片压缩转base64...input type=file accept=image/

    input file样式修改以及图片预览删除功能详细概括(推荐)

    本篇对input file进行了修改,改成自己需要的样式,类似验证身份上传身份证图片的功能。 效果图如下: 这里主要展示上传预览...input type=file class=file id=fileInput multiple accept=image/png, image/jpeg, ima

    vue实现移动端图片裁剪上传功能

    本文实例为大家分享了vue移动端图片裁剪上传的具体代码,供大家参考,具体内容如下 1.安装cropperjs依赖库 ...input class=file ref=file type=file accept=image/* @change=uploadChange> <div class

    JS HTML图片显示Canvas 压缩功能

    简单到延伸 最新需要js 文件压缩图片上传 以前没搞过,新手把学习过程分享 一.选择图片并显示 ...input id=imginput type=file accept=image/* onchange=showImg(this)> <div id=img1> <canvas cl

    jQuery完全实例.rar

    但是在你创建 input 元素的时会有限制,可以参考第二个示例。当然这个字符串可以包含斜杠 (比如一个图像地址),还有反斜杠。当你创建单个元素时,请使用闭合标签或 XHTML 格式。例如,创建一个 span ,可以用 $(...

    html5 input属性使用示例

    placeholder 默认提示字符 autofocus 当页面加载时,会获得焦点的一个按钮 x-webkit-speech 语音搜索,webkit内核才支持 accept 规定可上传的文件类型(仅适用type=file) alt 规定图片输入控件代替文本 ...

    安卓java获取webview源码-react-native-webview-android-file-upload:这是一个自定义React

    type="file" />元素上传<input type="file" /> : 通过使用相机拍摄新照片 通过使用相机录制新视频 通过从图库中选择现有的照片/视频 该模块的作用: 采取执行; 修复了一些第一次使用后无法打开相机的问题...

Global site tag (gtag.js) - Google Analytics