FileUpload系列:(4)HTML5的input:f-创新互联

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

创新互联建站主营垫江网站建设的网络公司,主营网站建设方案,成都App定制开发,垫江h5重庆小程序开发公司搭建,垫江网站营销推广欢迎垫江等地区企业咨询

默认情况下,所有文件类型都会显示出来,如果想限制它只显示特定的文件类型呢,比如“word“,”excel“,”pdf“文件 

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

还有另外一种形式:



accept属性列表
 

多个类型用逗号分隔开,因为accept是html5的新特性,所以火狐和IE的支持就显得单薄了

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

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

那么accept能限制哪些文件呢?见下表。

*.3gpp  audio/3gpp, video/3gpp  3GPP Audio/Video *.ac3   audio/ac3   AC3 Audio *.asf   allpication/vnd.ms-asf  Advanced Streaming Format *.au    audio/basic AU Audio *.css   text/css    Cascading Style Sheets *.csv   text/csv    Comma Separated Values *.doc   application/msword  MS Word Document *.dot   application/msword  MS Word Template *.dtd   application/xml-dtd Document Type Definition *.dwg   p_w_picpath/vnd.dwg   AutoCAD Drawing Database *.dxf   p_w_picpath/vnd.dxf   AutoCAD Drawing Interchange Format *.gif   p_w_picpath/gif   Graphic Interchange Format *.htm   text/html   HyperText Markup Language *.html  text/html   HyperText Markup Language *.jp2   p_w_picpath/jp2   JPEG-2000 *.jpe   p_w_picpath/jpeg  JPEG *.jpeg  p_w_picpath/jpeg  JPEG *.jpg   p_w_picpath/jpeg  JPEG *.js    text/javascript, application/javascript JavaScript *.json  application/json    JavaScript Object Notation *.mp2   audio/mpeg, video/mpeg  MPEG Audio/Video Stream, Layer II *.mp3   audio/mpeg  MPEG Audio Stream, Layer III *.mp4   audio/mp4, video/mp4    MPEG-4 Audio/Video *.mpeg  video/mpeg  MPEG Video Stream, Layer II *.mpg   video/mpeg  MPEG Video Stream, Layer II *.mpp   application/vnd.ms-project  MS Project Project *.ogg   application/ogg, audio/ogg  Ogg Vorbis *.pdf   application/pdf Portable Document Format *.png   p_w_picpath/png   Portable Network Graphics *.pot   application/vnd.ms-powerpoint   MS PowerPoint Template *.pps   application/vnd.ms-powerpoint   MS PowerPoint Slideshow *.ppt   application/vnd.ms-powerpoint   MS PowerPoint Presentation *.rtf   application/rtf, text/rtf   Rich Text Format *.svf   p_w_picpath/vnd.svf   Simple Vector Format *.tif   p_w_picpath/tiff  Tagged Image Format File *.tiff  p_w_picpath/tiff  Tagged Image Format File *.txt   text/plain  Plain Text *.wdb   application/vnd.ms-works    MS Works Database *.wps   application/vnd.ms-works    Works Text Document *.xhtml application/xhtml+xml   Extensible HyperText Markup Language *.xlc   application/vnd.ms-excel    MS Excel Chart *.xlm   application/vnd.ms-excel    MS Excel Macro *.xls   application/vnd.ms-excel    MS Excel Spreadsheet *.xlt   application/vnd.ms-excel    MS Excel Template *.xlw   application/vnd.ms-excel    MS Excel Workspace *.xml   text/xml, application/xml   Extensible Markup Language *.zip   aplication/zip  Compressed Archive

参考文章:

http://www.haorooms.com/post/input_file_leixing

另外有需要云服务器可以了解下创新互联cdcxhl.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。


分享标题:FileUpload系列:(4)HTML5的input:f-创新互联
文章转载:http://hbruida.cn/article/cddsds.html