网页上添加一个input file HTML控件:

  1. <input id="File1" type="file" />

  默认是这样的,所有文件类型都会显示出来,如果想限制它只显示我们设定的文件类型呢,比如“word“,”excel“,”pdf“文件 

  解决办法是可以给它添加一个accept属性,比如:

  1. <input id="File1" type="file" accept=".xls,.doc,.txt,.pdf" />

  这样选择的时候默认会显示为这样:

文件选择框内只显示出你自定义文件类型的文件,也还比较方便。

But,这只是最简单的掩人耳目的做法,还是能选择其它文件类型:

所以,如果要做到真正意义上限制类型做法(其实这种算不上限制,只是把你要的文件类型默认显示出来而已,并不是说不能选择其它的),还是要通过js或者后台来控制。

附支持的文件类型:

  1. *.3gpp audio/3gpp video/3gpp 3GPP Audio/Video
  2. *.ac3 audio/ac3 AC3 Audio
  3. *.asf allpication/vnd.ms-asf Advanced Streaming Format
  4. *.au audio/basic AU Audio
  5. *.css text/css Cascading Style Sheets
  6. *.csv text/csv Comma Separated Values
  7. *.doc application/msword MS Word Document
  8. *.dot application/msword MS Word Template
  9. *.dtd application/xml-dtd Document Type Definition
  10. *.dwg image/vnd.dwg AutoCAD Drawing Database
  11. *.dxf image/vnd.dxf AutoCAD Drawing Interchange Format
  12. *.gif image/gif Graphic Interchange Format
  13. *.htm text/html HyperText Markup Language
  14. *.html text/html HyperText Markup Language
  15. *.jp2 image/jp2 JPEG-2000
  16. *.jpe image/jpeg JPEG
  17. *.jpeg image/jpeg JPEG
  18. *.jpg image/jpeg JPEG
  19. *.js text/javascript application/javascript JavaScript
  20. *.json application/json JavaScript Object Notation
  21. *.mp2 audio/mpeg video/mpeg MPEG Audio/Video Stream Layer II
  22. *.mp3 audio/mpeg MPEG Audio Stream Layer III
  23. *.mp4 audio/mp4 video/mp4 MPEG-4 Audio/Video
  24. *.mpeg video/mpeg MPEG Video Stream Layer II
  25. *.mpg video/mpeg MPEG Video Stream Layer II
  26. *.mpp application/vnd.ms-project MS Project Project
  27. *.ogg application/ogg audio/ogg Ogg Vorbis
  28. *.pdf application/pdf Portable Document Format
  29. *.png image/png Portable Network Graphics
  30. *.pot application/vnd.ms-powerpoint MS PowerPoint Template
  31. *.pps application/vnd.ms-powerpoint MS PowerPoint Slideshow
  32. *.ppt application/vnd.ms-powerpoint MS PowerPoint Presentation
  33. *.rtf application/rtf text/rtf Rich Text Format
  34. *.svf image/vnd.svf Simple Vector Format
  35. *.tif image/tiff Tagged Image Format File
  36. *.tiff image/tiff Tagged Image Format File
  37. *.txt text/plain Plain Text
  38. *.wdb application/vnd.ms-works MS Works Database
  39. *.wps application/vnd.ms-works Works Text Document
  40. *.xhtml application/xhtml+xml Extensible HyperText Markup Language
  41. *.xlc application/vnd.ms-excel MS Excel Chart
  42. *.xlm application/vnd.ms-excel MS Excel Macro
  43. *.xls application/vnd.ms-excel MS Excel Spreadsheet
  44. *.xlt application/vnd.ms-excel MS Excel Template
  45. *.xlw application/vnd.ms-excel MS Excel Workspace
  46. *.xml text/xml application/xml Extensible Markup Language
  47. *.zip aplication/zip Compressed Archive

  

input file控件限制上传文件类型的更多相关文章

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

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

  2. input file实现多次上传文件(不会覆盖上次上传的文件)

    html原生的file多选控件:<input class="className" type="file" name="name" ac ...

  3. 20160620001 FileUpload控件获取上传文件的路径

    参考地址: http://bbs.csdn.net/topics/350051517 —————————————————————————————— 用js实现 <%@ Page Language ...

  4. input 限制 上传文件类型

    参考:input file控件限制上传文件类型 HTML <input> 标签的 accept 属性 网页上添加一个input file HTML控件: <input id=&quo ...

  5. 使用input:file控件在微信内置浏览器上传文件返回未显示选择的文件

    使用input:file控件在微信内置浏览器上传文件返回未显示选择的文件 原来的写法: <input type="file" accept="image/x-png ...

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

    用 input 的file类型标签上传文件,有时需要限制上传文件类型,添加accept属性可以实现 <input type="file" accept="image ...

  7. input type='file'限制上传文件类型

    前端与后台数据进行对接时,就避免不了要使用ajax进行http请求,常用的请求就两个post与get:然而常见的post请求的需求是文件上传,可能我一说到文件上传大家都觉得so  easy啊,没什么嘛 ...

  8. input(file)样式修改及上传文件名显示

    实现思路: a标签包裹input元素 设置a标签为上传按钮的样式,相对定位 设置input为透明,绝对定位,覆盖到a上面 效果:看到的按钮是a的样式,点击时实际是点击input元素.样式和功能都具备 ...

  9. 如何使用Python调用AutoIt来实现Flash控件的上传功能

    先看一段代码 upload.au3(这个后缀autoit3的格式): ;等待出现title为数据采集-军课网-MozillaFirefox的浏览器窗口 WinWait("数据采集 - XX网 ...

随机推荐

  1. 优化mysql服务器

    一.使用show variables 和show status 命令查看MySQL的服务器静态参数值和动态运行状态信息. 二.可以使用 mysqld --verbose --help|more 查看某 ...

  2. 【转】HiveQL:对数据定义的学习

    1.Hive中的数据库: 它是表的一个目录或者命名空间,用来避免表命名冲突,我们通常使用数据库来将生产表组织成逻辑组. 基本命令: (1)创建一个数据库(如果不存在该数据库): create data ...

  3. html iframe 元素之间的调用

    html iframe 元素之间的调用一.简介 一般需要引入一个独立页面的时候,我们会使用iframe.在业务需要的时候,我们需要在父页面与iframe页面之间进行交互.交互的时候,我们就需要使 用到 ...

  4. spring中的定时调度实现TimerFactoryBean引起的隐患

    手中的一个老项目,其中使用的TimerFactoryBean实现的调度任务.一般都是spring quartz实现,这种的着实少见.正因为少见资料比较少,当初为了确认这个会不会2个调度任务同时并行执行 ...

  5. hdfs client access the hdfs cluster not in one domain

    https://hadoop.apache.org/docs/stable/hadoop-project-dist/hadoop-hdfs/HdfsMultihoming.html#Clients_u ...

  6. 数据库SQL基本操作

    1.查询表结构 desc 表名 2.显示当前连接用户 show user 3.查看系统拥有哪些用户 select * from all_users; 4.查询当前用户下所有对象 select * fr ...

  7. Java关键字 ClassName.this(类名.this)的理解

    关键字this用于指代当前的对象.因此,类内部可以使用this作为前缀引用实例成员: this()代表了调用另一个构造函数,至于调用哪个构造函数根据参数表确定.this()调用只 能出现在构造函数的第 ...

  8. 线程同步以及 yield() wait()和notify()、notifyAll()

    1.yield() 该方法与sleep()类似,只是不能由用户指定暂停多长时间,并且yield()方法只能让同优先级的线程有执行的机会. 2.wait()和notify().notifyAll() 这 ...

  9. Socket

    Socket又称"套接字",应用程序通常通过"套接字"向网络发出请求或者应答网络请求. 以J2SDK-1.3为例,Socket和ServerSocket类库位于 ...

  10. winform记事本(基本功能)

    本题主要考察各种控件的应用 using System; using System.Collections.Generic; using System.ComponentModel; using Sys ...