FormData+Ajax实现上传进度监控

//实例化一个formData对象var formData = new FormData();formData.append("username", "Groucho");formData.append("userid", 123456); // 数字 123456 会被立即转换成字符串 "123456"// HTML上的 文件类型input[type=file]的文件框，由用户选择formData.append("userfile", fileInputElement.files[0]);// JavaScript file-like 对象var content = '<a id="a"><b id="b">hey!</b></a>'; // 新文件的正文...var blob = new Blob([content], { type: "text/xml"});formData.append("webmasterfile", blob);

//记录当前时间var time=new Date().getTime();//记录当前进度var percentage =null;//记录当前上传速度var velocity=null;//记录已上传文件字节大小var loaded=0;$.ajax({ url: 'Url', type: "POST", data: formData, contentType: false, // 必须 不设置内容类型 processData: false, // 必须 不处理数据 xhr: function xhr() {  //获取原生的xhr对象  var xhr = $.ajaxSettings.xhr();  if (xhr.upload) {   //添加 progress 事件监听   xhr.upload.addEventListener('progress', function (e) {    var nowDate = new Date().getTime();    //每一秒刷新一次状态    if (nowDate - time >= 1000) {     //已上传文件字节数/总字节数     percentage = parseInt(e.loaded / e.total * 100);     //当前已传大小(字节数)-一秒前已传文件大小(字节数)     velocity = (e.loaded - loaded) / 1024;     if (percentage >= 99) {      $(".hintText").html('服务端正在解析，请稍后');     } else {      //修改上次记录时间及数据大小      time = nowDate;      loaded = e.loaded;     }    } else {     return;    }   }, false);  }  return xhr; }, success: function success(response) {  //成功回调    }, error: function error(error) {  //失败回调     }});