前端附件上传的方式有哪些？

第一种： 传统的from 和input 上传 1.使用input选择文件，设置好其他input的值，点击提交，将文件数据及签名等认证信息发送到form设置的action对应的页面，浏览器也会跳转到该页面。

　　 　　 　　

触发form表单提交可以用 按钮，type='submit' 按钮，以及js的 form.submit() 方法； 优点： 1.兼容性好，基本上所有浏览器都支持； 缺点： 1.提交数据后页面会跳转； 2.因为是页面跳转，不是一个ajax提交，所以前端无法知道什么时候上传结束； 第二种： fromData上传 使用方法： //先在页面上添加一个input控件 //定义方法 function fn_upload(){ let formData = new FormData() let userfile = document.querySelector('input[type=file]').files[0] //添加健值 formData.append('file', userfile) //'file' 这个名字要和后台获取文件的名字一样; //提交 $.ajax({ type : "post", url : "www.baidu.com/imgupload", data : formData, headers:{ "Content-Type":"multipart/form-data" }, cache: false, processData:false, contentType:false, success:function(data){ console.log("上传成功！") } }) } 优点： 1.因为是ajax上传，可以接收接口的返回数据， 准确了解到上传情况； 缺点： 1.兼容性差 但最低兼容IE10版本；

本文章由javascript技术分享原创和收集