带进度条的ajax上传文件方法：
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
var videoFormFile = new FormData(); videoFormFile.append("title", videoFile.name); //加入文件对象 videoFormFile.append("file_data", videoFile); //加入文件对象 $.ajax({ cache: false, processData: false, contentType: false, url:'uploadUrl', method:'POST', dataType:'json', data:videoFormFile, xhr: function() { //ajax进度条 var xhr = $.ajaxSettings.xhr(); if(onprogress && xhr.upload) { xhr.upload.addEventListener("progress" , onprogress, false); return xhr; } function onprogress(evt){ var loaded = evt.loaded; //已经上传大小情况 var tot = evt.total; //附件总大小 var per = Math.floor(100*loaded/tot); //已经上传的百分比 // 根据返回的数值显示进度条 $('#uploadVideoProgress').html(per + '%'); $('#uploadVideoProgress').css({ width:per + '%' }); } }, success:function(res){ // 上传成功 do something } }); |
文章评论 暂无评论
暂无评论