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=" ...
随机推荐
- RN开发-Flex
1.容器属性 (1). display : flex | inline-flex (块级伸缩容器 | 行内级伸缩容器) (2). flex-direction : row ...
- WebRTC 之ICE浅谈
前言 ICE全称Interactive Connectivity Establishment:交互式连通建立方式. ICE参照RFC5245建议实现,是一组基于offer/answer模式解决NAT穿 ...
- ansible笔记(13):变量(二)
1.谈一谈[Gathering Facts]:使用setup模块查看 当我们运行一个playbook时,默认都会运行一个名为“[Gathering Facts]”的任务,前文中已经大致的介绍过这个默认 ...
- 【网站】Kiwi浏览器中文网
2020年1月1日上线 访问地址:http://huangenet.gitee.io/kiwibrowser/
- linux - 数据库 - Connected to an idle instance
运行 connect /as sysdba; 报错:Connected to an idle instance 原因:配置文件 .bash_profile 中的 ORACLE_HOME 的最后这个 / ...
- 第一次刷leetcode小结
LeetCode 上不会的 Reverse Integer Gray Code Generate Parentheses Pascal's Triangle II 正方向读和反方向读保持不变的区别 T ...
- 【转载】Hibernate映射文件详解
转自:http://blog.163.com/hzd_love/blog/static/13199988120108265317988/ Hibernate的持久化类和关系数据库之间的映射通常是用一个 ...
- Codeforces Round #615 (Div. 3) A-F简要题解
contest链接:https://codeforces.com/contest/1294 A. 给出a.b.c三个数,从n中分配给a.b.c,问能否使得a = b = c.计算a,b,c三个数的差值 ...
- C语言数据结构——第四章 串
四.串 4.1-串的基本概念 串的定义 串是由数字.字母或其他字符组成的有限序列,一般记为 StringName = “a[0]a[1]a[2]···a[i]···a[n-1]”(n>0,0&l ...
- mysql查询速度慢的分析和解决
一.定位执行慢的sql,如2秒内没执行完的抽取出来 show engines;查看慢查询时间show variables like 'slow%';查看设置多久是慢查询show variables l ...