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. nodejs授权连接mongodb

    mongodb安装完以后是没有用户连接授权验证的 在控制台直接输入mongo进入交互模式 show dbs use databaseName show collections 这些基本的命令都不会有问 ...

  2. 用H5和js写一个移动端自定义播放器

    前言 由于html5自带的播放器样式不怎么好看,大多数人都是自己写一个来满足业务需求.这一次的需求如下: 1.不要上一曲下一曲 2.有进度条和播放暂停按钮 3.有时间显示 demo实现功能 1.进度条 ...

  3. 在同台电脑上再次安装MySql需要注意的事项

    今天安装了一下mysql,出现的问题主要是在最后一步: msyql 安装到最后一步 start service 错误解决方法 1, 到控制面板里面先把 mysql 删除 . 2. 到 c 盘 C:\P ...

  4. extjs_button

    在网页中,填写的内容都在form(表单)中显示,要交互就要用到按钮.所以,今天试了一下按钮,但不清楚的是js中定义的按钮能显示在页面,但怎样响应php代码呢?实际效果就是点击按钮后,通过什么方式调出数 ...

  5. UML和UP简介(转载)

    UML(统一建模语言,Unified Modeling Language)是用于系统的可视化建模语言.  UP(统一过程,Unified Process)是通用的软件开发过程. 很多人或书籍过大的夸大 ...

  6. MySQL数据库之------DOS命令行的基本操作

    1.   进入D盘的如下路径: 按住   ctrl+shift  ,右键,选择在此处打开命令行窗口.出现图2.   图   1  图 2 2. .     3.   图 3  4.    图 4   ...

  7. 关于Kendo的Grid 单元格样式

    <!DOCTYPE html><html style="height: 100%;"><head><meta http-equiv=&qu ...

  8. BeanUtils.copyProperties() 用法

    BeanUtils提供对Java反射和自省API的包装.其主要目的是利用反射机制对JavaBean的属性进行处理.我们知道,一个JavaBean通常包含了大量的属性,很多情况下,对JavaBean的处 ...

  9. java 队列基础操作

    http://www.cnblogs.com/fuck1/p/5996116.html 队列(简称作队,Queue)也是一种特殊的线性表,队列的数据元素以及数据元素间的逻辑关系和线性表完全相同,其差别 ...

  10. DOm4解析xml

    1.创建XML文档对象的的方式有两种 1)Document document=DocumentHelper.createDocument(); 2)DocumentFactory documentFa ...