django 上传文件进度条

最新推荐文章于 2023-09-13 11:12:13 发布

JackLiu16

最新推荐文章于 2023-09-13 11:12:13 发布

阅读量4.8k

点赞数 5

分类专栏： django

本文链接：https://blog.csdn.net/JackLiu16/article/details/86567751

版权

本文介绍了如何在Django框架下实现文件上传时显示进度条的功能，通过参考相关教程和资源，详细讲解了实现过程。

摘要由CSDN通过智能技术生成

upload.html

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script>
		function on_progress(evt) {       //看这个函数之前先看upload函数。这个函数可以接收一个evt(event)对象(细节自行查询progress)，他有3个属性lengthComputable，loaded，total，第一个属性是个bool类型的，代表是否支持，第二个代表当前上传的大小，第三个为总的大小，由此便可以计算出实时上传的百分比
			if(evt.lengthComputable) {
				var ele = document.getElementById('2');
				var percent = Math.round((evt.loaded) * 100 / evt.total);
				ele.style.width = percent + '%';
				document.getElementById('3').innerHTML = percent + '%';
			}
		}
		function upload() {
			var xhr = new XMLHttpRequest();
			var file = document.getElementById('file').files[0];   //取得文件数据，而.file对象只是文件信息
            console.log(file);
			var form = new FormData();   //FormData是HTML5为实现序列化表单