js实现带上传进度的文件上传
代码如下:
//获取文件筐的文件集合
var files = document.getElementById("file1").files;
//创建FormData对象 相当于参数集合 存储方式是键值对
var formData = new FormData();
//添加第一个文件到FormData
formData.append("file", files[0]);
//添加普通数据 后台直接参数接受
formData.append("name", "KevinBlandy");
//创建异步对象
var xhr = new XMLHttpRequest();
//打开连接
xhr.open('POST', '/Home/UpFile', true);
//监听上传事件
if (xhr.upload) {
//监听上传属性的上传事件,每次上传事件都会执行 progressHandlingFunction
xhr.upload.addEventListener('progress', progressHandlingFunction, false);
//xhr.upload.progress = function(){} 也可以
}
//执行上传
xhr.send(formData);
//上传监听 回调
function progressHandlingFunction(event) {
event.total; //获取上传文件的总大小
event.loaded; //获取已经上传的文件大小
//获取进度的百分比值
let percent = (event.loaded / event.total) * 100;
//四舍五入保留0位小数
percent = percent.toFixed(0);
var jd = document.getElementById("jd");
jd.value = percent;
}本文内容仅供个人学习/研究/参考使用,不构成任何决策建议或专业指导。分享/转载时请标明原文来源,同时请勿将内容用于商业售卖、虚假宣传等非学习用途哦~感谢您的理解与支持!