input 标签的 accept 属性、excel等文件类型

柔情只为你懂 2022-12-27 07:28 669阅读 0赞

[HTMLinput 标签的 accept 属性\_丿灬安之若死-CSDN博客][HTMLinput _ accept _-CSDN]

[HTML5 input file类型，accept（文件类型控制）\_Mr.懒懒猪的博客-CSDN博客\_accept][HTML5 input file_accept_Mr._-CSDN_accept]

[accept的文件类型\_Honey\_Potter的博客-CSDN博客\_accept类型][accept_Honey_Potter_-CSDN_accept]

## 属性值 ##

<table> 
 <tbody> 
  <tr> 
   <th>值</th> 
   <th>描述</th> 
  </tr> 
  <tr> 
   <td>audio/*</td> 
   <td>接受所有的声音文件。</td> 
  </tr> 
  <tr> 
   <td>video/*</td> 
   <td>接受所有的视频文件。</td> 
  </tr> 
  <tr> 
   <td>image/*</td> 
   <td>接受所有的图像文件。</td> 
  </tr> 
 </tbody> 
</table>

accept表示可以上传文件类型，image表示图片，*表示所有支持的格式。
    
    只支持excel文件类型上传
    <input type="file" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" multiple="multiplt">
    
    *表示所有支持的格式
    <input type="file" accept="*" multiple="multiplt" />  
    
    支持所有的图像(图片)文件
    <input type="file" accept="image/*" multiple="multiplt" />   
    
    上传Pdf
    <input type="file" accept="application/msword, application/pdf" multiple="multiplt" />
    
    上传 .zip,.rar
    <input type="file" accept=".zip,.rar,application/x-rar-compressed,application/zip,application/x-zip-compressed,application/octet-stream"
    multiple="multiplt"/>

**实例 :**

1.accept="image/gif, image/jpeg"

2.accept="application/msword"  
3.accept="application/pdf"  
4.accept="application/poscript"  
5.accept="application/rtf"  
6.accept="application/x-zip-compressed"  
7.accept="audio/basic"  
8.accept="audio/x-aiff"  
9.accept="audio/x-mpeg"

[HTMLinput _ accept _-CSDN]: https://blog.csdn.net/mp624183768/article/details/84761914?ops_request_misc=&request_id=&biz_id=102&utm_term=input%2520accept&utm_medium=distribute.pc_search_result.none-task-blog-2~blog~sobaiduweb~default-2-84761914.nonecase
[HTML5 input file_accept_Mr._-CSDN_accept]: https://blog.csdn.net/zhuyangru/article/details/70254789
[accept_Honey_Potter_-CSDN_accept]: https://blog.csdn.net/Honey_Potter/article/details/54572590?utm_medium=distribute.pc_relevant_t0.none-task-blog-OPENSEARCH-1.control&depth_1-utm_source=distribute.pc_relevant_t0.none-task-blog-OPENSEARCH-1.control