html input file 设置文件类型
解决方案:
使用 input 的 accept 属性指定接受文件类型
-----------更新---------------
之前的代码有个缺点,打开文件窗口时会自动筛选文件夹下所有符合设定类型的文件,造成文件窗口延迟一定时间。
优化的方法是列出你需要的 详细 类型,比如:
For Image Files (.png/.jpg/etc), use: <input type="file" accept="image/x-png,image/gif,image/jpeg,image/bmp" />
这样打开的速度就快很多了
-------------之前的代码---------------------
下面是指定类型的代码:
Valid Accept Types: For CSV files (.csv), use: <input type="file" accept=".csv" />
For Excel Files 2003-2007 (.xls), use: <input type="file" accept="application/vnd.ms-excel" />
For Excel Files 2010 (.xlsx), use: <input type="file" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" />
For Text Files (.txt) use: <input type="file" accept="text/plain" />
For Image Files (.png/.jpg/etc), use: <input type="file" accept="image/*" />
For HTML Files (.htm,.html), use: <input type="file" accept="text/html" />
For Video Files (.avi, .mpg, .mpeg, .mp4), use: <input type="file" accept="video/*" />
For Audio Files (.mp3, .wav, etc), use: <input type="file" accept="audio/*" />
For PDF Files, use: <input type="file" accept=".pdf" />
html input file 设置文件类型的更多相关文章
- HTML5: input:file上传类型控制
ylbtech-HTML5: input:file上传类型控制 1. 一.input:file 属性返回顶部 一.input:file属性 属性值有以下几个比较常用: accept:表示可以选择的 ...
- HTML5的 input:file上传类型控制(转载)
http://www.haorooms.com/post/input_file_leixing HTML5的 input:file上传类型控制 2014年8月29日 66352次浏览 一.input: ...
- struts2 input file多文件同时通过ajax提交
<input type="file" name="files" multiple="multiple">必须是multiple才 ...
- HTML5的 input:file上传类型控制
一.input:file属性 属性值有以下几个比较常用: accept:表示可以选择的文件MIME类型,多个MIME类型用英文逗号分开,常用的MIME类型见下表. multiple:是否可以选择多个文 ...
- 动态input file多文件上传到后台没反应的解决方法!!!
其实我也不太清除具体是什么原因,但是后面就可以了!!! 我用的是springMVC 自带的文件上传 1.首先肯定是要有springMVC上传文件的相关配置! 2.前端 这是动态input file上传 ...
- php设置文件类型content-type
在PHP中可以通过header函数来发送头信息,还可以设置文件的content-type,下面整理了一些常见文件类型对于的content-type值. //date 2015-06-22//定义编码h ...
- html,图片上传预览,input file获取文件等相关操作
input file常用方法: var obj=document.getElementById("upimage"); var file=obj.files[0];//获取文件数据 ...
- file - 确定文件类型
总览 file [ -bcnsvzL ] [ -f 命名文件 ] [ -m 幻数文件 ] file ... 描述 本手册页说明了3.27版本 file 命令的使用. File 命令试图检查每个参数以判 ...
- input type="file"指定文件类型为excel
指定上传类型为excel:加上accept="application/vnd.ms-excel"即可,只兼容chrome跟ff,不兼容ie <input type=" ...
随机推荐
- Python开发坦克大战
Python不仅能开发网站,爬虫数据分析等,他其实也可以写游戏,接下来就给大家分享下坦克大战的代码: PS:很多人在学习Python的过程中,往往因为遇问题解决不了或者没好的教程从而导致自己放弃,为此 ...
- 0005 修改Django工程名
写框架非常耗时间,把框架写好以后,经测试稳定的框架,需要保存下来,以后有工程需要,直接更改工程名即可. 01 右键点击工程名,点击Refactor/Rename 02 选择更改工程名 03 关闭PyC ...
- OpenGL 编程指南 (2)
1.OpenGL对共享的边有严格的规定:1)共享边上的像素因为同事被两者所覆盖,因此不可能不受到光照计算的影响: 2)共享边上的像素值,不可能受到多于一个三角形的光照计算的影响. 2.多边形存在正面与 ...
- Python中super的用法【转载】
Python中super的用法[转载] 转载dxk_093812 最后发布于2019-02-17 20:12:18 阅读数 1143 收藏 展开 转载自 Python面向对象中super用法与MRO ...
- 《NVM-Express-1_4-2019.06.10-Ratified》学习笔记(8.21)-- Host Operation with Asymmetric Namespace Access Reporting
8.21 使用ANA报告的主机操作 8.21.1 主机ANA普通操作 主机通过在Identify Controller数据结构中CMIC域的第3位来判断是否支持ANA.NSID或标识(参考第7.10章 ...
- 【PAT甲级】1115 Counting Nodes in a BST (30分)(二叉查找树)
题意: 输入一个正整数N(<=1000),接着输入N个整数([-1000,1000]),依次插入一棵初始为空的二叉排序树.输出最底层和最底层上一层的结点个数之和,例如x+y=x+y. AAAAA ...
- centos7下使用selenium实现文件上传
1.pip install SendKeys 2. 利用js去掉元素的隐藏属性,然后输入: 一般控制元素显示或隐藏是用display属性来实现的 style.display = “none”,表示元素 ...
- Linux 虚拟机共享目录
1. 开启linux虚拟机 2. 菜单“虚拟机” -------“重新安装 Vm tools” 3. 桌面看到 VmTools 安装盘 4. 安装 5. 设置中添加共享目录 5. ...
- docker使用nginx实现ssl(https)反向代理其他容器应用
安装nginx容器 搜索nginx镜像 docker search nginx 拉取最新版nginx docker pull nginx:latest 运行容器 docker run --name=n ...
- python3练习100题——012
今天继续,答案都通过py3测试. 原题链接:http://www.runoob.com/python/python-exercise-example12.html 题目:判断101-200之间有多少个 ...