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;
}
上一篇:第三个spring冲刺第9天


下一篇:HBase指定大量列集合的场景下并发拉取数据时卡住的问题排查