html input=”file” 浏览时只显示指定文件类型 xls、xlsx、csv


<input id="fileSelect" type="file" accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" />

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" /> 

DEMO:

http://jsfiddle.net/dirtyd77/LzLcZ/144/

NOTE:

If you are trying to display Excel CSV files (.csv), do NOT use:

  • text/csv
  • application/csv
  • text/comma-separated-values (works in Opera only).

    If you are trying to display a particular file type (for example, a WAV or PDF), then this will almost always work…
 <input type="file" accept=".FILETYPE" />

原文:http://stackoverflow.com/questions/11832930/html-input-file-accept-attribute-file-type-csv

HTML input="file" 浏览时只显示指定文件类型 xls、xlsx、csv的更多相关文章

  1. <input type="file" />浏览时只显示指定文件类型

    <input type="file" />浏览时只显示指定文件类型 <input type="file" accept="appli ...

  2. input="file" 浏览时只显示指定excel文件,筛选特定文件类型

    <p>显示 .xls, .xlsx, .csv 文件...</p> <input type="file" accept=".csv, app ...

  3. nput="file" 浏览时只显示指定excel文件,筛选特定文件类型

    <p>显示 .xls, .xlsx, .csv 文件...</p><input type="file" accept=".csv, appl ...

  4. css控制打印时只显示指定区域

      CreateTime--2017年9月26日08:16:04 Author:Marydon css控制打印时只显示指定区域 思路: 1.使用打印命令@media print: 2.控制执行打印命令 ...

  5. findstr 只搜寻指定文件类型

    Title:findstr 只搜寻指定文件类型 --2012-05-04 09:27 findstr /i /m /S /C:"关键字"  *.php *.asp *.jsp

  6. input file控件限制上传文件类型

    网页上添加一个input file HTML控件: <input id="File1" type="file" /> 默认是这样的,所有文件类型都会 ...

  7. 【转】input file accept属性可以限制的文件类型

    来源:http://blog.sina.com.cn/s/blog_6c9d65a10101a8yh.html 在上传文件的时候,需要限制指定的文件类型. <input type="f ...

  8. html属性,上传图片选择时只显示图片文件

    这个实现比较简单,就是用到accept属性: 注意这里我们对这个file元素进行了隐藏,因为它默认呈现是下面这个样子的,并不好看. <div style="display:none;& ...

  9. HTML5中的input type为file控件限制上传文件类型及扩展

    简单介绍 input file控件限制上传文件类型如下:1.文件类型中间用,分开:2.html和htm这样的要写成两个: 3实例: <input type="file" na ...

随机推荐

  1. Cosh.2

    没壳 直接拖 一开始  字符长度不对.   所以  输入都超过5   就没什么问题了 发现下面的跳转都是跳到eorr的 那不跳的条件呢 看来他们必须要相等.单步跟踪就会发现eax指向的是我们的Seri ...

  2. commitizen-规范commit-message

    安装指南 安装commitizen sudo npm install -g commitizen 配置 cd到.git所在目录 commitizen init cz-conventional-chan ...

  3. DIPHA

    https://github.com/DIPHA/dipha http://www.rkwitt.org/blog/topological_machine_learning.html 一.预装软件 1 ...

  4. [转]: 两分钟彻底让你明白Android Activity生命周期(图文)!

    转自:http://blog.csdn.net/android_tutor/article/details/5772285 大家好,今天给大家详解一下Android中Activity的生命周期,我在前 ...

  5. 【PHP开发】国外程序员收集整理的 PHP 资源大全

    依赖管理 依赖和包管理库 Composer/Packagist:一个包和依赖管理器 Composer Installers:一个多框架Composer库安装器 Pickle:一个PHP扩展安装器 其他 ...

  6. 微信开发03----------XML解析与封装

    3.1 解析微信发来的请求  微信服务器发来的请求消息都被封装在request对象中,可以从request对象中将请求参数取出来.通常是用request的getParament()方法获取请求中的参数 ...

  7. oracle查询一个时间段每天的数据量

    1.需求: 从所有数据中,查出一个时间段中每天的数据量,即:按日做汇总. 2.SQL语句模板: select trunc(date_col) date, sum(num_col) num, count ...

  8. mysql数据库的基本操作

    mysql数据库的基本操作dos命令启动mysql服务:net start mysql启动数据库: mysql -uroot -p查看所有的数据库:show databases:新建数据库:creat ...

  9. 【Cocos2d-x 3.x】屏幕自适应匹配

    在进行游戏开发时, 由于市场上的Android移动设备的分辨率有很多种,而且IOS移动设备的分辨率也不相同,为了能让手游能在90%以上的移动设备较为完美的运行,因此需要考虑屏幕的自适应问题,让一套资源 ...

  10. 微信公众号开发之被逼学web服务端1-----使用SecureCRT连接Linux服务器

    做Android的进新公司后安排做微信公众号开发,这基本是后台和前端的活都要由小白的我来做,这两天基本成鸭子了,被填的满满的,却还是不够,博文仅作记录,希望能给后来的小白一点参考吧 今天做的是如何配置 ...