HTML上传文件

最新推荐文章于 2024-09-19 15:29:23 发布

cheniie

最新推荐文章于 2024-09-19 15:29:23 发布

阅读量1.7w

点赞数 6

分类专栏：前端文章标签： html

本文链接：https://blog.csdn.net/puss0/article/details/113812990

版权

前端专栏收录该内容

6 篇文章 1 订阅

订阅专栏

文件上传表单：

<form action="/" method="post" enctype="multipart/form-data">
    <div><input type="file" multiple="multiple" accept="image/*" name="image"></div>
    <div><input type="submit" value="上传"></div>
</form>

加上multiple="multiple"可以上传多个文件，否则只能传单个文件。
accept="image/*"表示上传文件的MIME类型，多个MIME类型用逗号隔开，常见MIME类型如下：

后缀名       MIME名称
-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-
*.3gpp     audio/3gpp, video/3gpp
*.ac3      audio/ac3
*.asf      allpication/vnd.ms-asf
*.au       audio/basic
*.css      text/css
*.csv      text/csv
*.doc      application/msword    
*.dot      application/msword    
*.dtd      application/xml-dtd    
*.dwg      image/vnd.dwg    
*.dxf      image/vnd.dxf
*.gif      image/gif    
*.htm      text/html    
*.html     text/html    
*.jp2      image/jp2    
*.jpe      image/jpeg
*.jpeg     image/jpeg
*.jpg      image/jpeg    
*.js       text/javascript, application/javascript    
*.json     application/json    
*.mp2      audio/mpeg, video/mpeg    
*.mp3      audio/mpeg    
*.mp4      audio/mp4, video/mp4    
*.mpeg     video/mpeg    
*.mpg      video/mpeg    
*.mpp      application/vnd.ms-project    
*.ogg      application/ogg, audio/ogg    
*.pdf      application/pdf    
*.png      image/png    
*.pot      application/vnd.ms-powerpoint    
*.pps      application/vnd.ms-powerpoint    
*.ppt      application/vnd.ms-powerpoint    
*.rtf      application/rtf, text/rtf    
*.svf      image/vnd.svf    
*.tif      image/tiff    
*.tiff     image/tiff    
*.txt      text/plain    
*.wdb      application/vnd.ms-works    
*.wps      application/vnd.ms-works    
*.xhtml    application/xhtml+xml    
*.xlc      application/vnd.ms-excel    
*.xlm      application/vnd.ms-excel    
*.xls      application/vnd.ms-excel    
*.xlt      application/vnd.ms-excel    
*.xlw      application/vnd.ms-excel    
*.xml      text/xml, application/xml    
*.zip      aplication/zip    
*.xlsx     application/vnd.openxmlformats-officedocument.spreadsheetml.sheet

如果要上传文件夹，则需要使用webkitdirectory，但是一旦使用了这个参数，就只能上传文件夹了，单文件和多文件的选项都会失效。

<form action="/" method="post" enctype="multipart/form-data">
    <div><input type="file" webkitdirectory accept="image/*" name="image"></div>
    <div><input type="submit" value="上传"></div>
</form>