关于html:html中input的accept总结

36次阅读

共计 1488 个字符,预计需要花费 4 分钟才能阅读完成。

1. 开发环境 vue2
2. 电脑系统 windows11 专业版
3. 在开发的过程中, 咱们常常会应用 input, 咱们有时候须要设置 input 的 accept 属性规定通过文件上传来提交的文件的类型。上面我来做下总结。
4.accept 值:

扩展名
.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
.xlsx application/vnd.openxmlformats-officedocument.spreadsheetml.sheet
.xlt application/vnd.ms-excel
.xlw application/vnd.ms-excel
.xml text/xml, application/xml
.zip aplication/zip

5. 应用 input 怎么动静设置 accept 呢?

// template 代码
<form class="fileUpdateForm">
  <input type="file" 
  name="uploadFile" 
  class="filesrc" 
  @change="changeFile">
</form>
// 办法代码
this.$el.querySelector('.filesrc').accept = this.localUploadOptions.acceptType;
this.$el.querySelector('.filesrc').click();


6. 本期的分享到了这里就完结啦, 心愿对你有所帮忙, 让咱们一起致力走向巅峰。

正文完
 0