网页上添加一个input file HTML控件:
<input id="File1" type="file" />
默认情况下,所有文件类型都会显示出来,如果想限制它只显示特定的文件类型呢,比如“word“,”excel“,”pdf“文件
解决办法是可以给它添加一个accept属性,比如:
<input id="File1" type="file" accept=".xls,.doc,.txt,.pdf" />
还有另外一种形式:
<input type="file" accept="application/msword" ><br><br>accept属性列表<br>
<form> <input type="file" name="pic" id="pic" accept="p_w_picpath/gif, p_w_picpath/jpeg" /></form>
多个类型用逗号分隔开,因为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