ajax上传文件监听进度xhr.upload.onprogress方法

jQuery中的ajax上传方式

$.ajax({
	 xhrFields: {
	      withCredentials: true
	  },
	  crossDomain: true == !(document.all),
	  type: 'POST', // 请求方式
	  url: globleObj.domain + '/wjw/workPlan/uploadPdf', // 接口地址
	  data: addFd, // 请求参数
	  dataType: 'json',// 返回参数格式
	  cache: false,
	  processData: false, // 告诉jQuery不要去处理发送的数据
	  contentType: false,// 告诉jQuery不要去设置Content-Type请求头
	  success: function (data) {
	  },
	  error: function () {
	  },
	  xhr: function() {
	      var xhr = $.ajaxSettings.xhr();
	      if (xhr.upload) {
	          xhr.upload.onprogress = function(e) {
	              if (e.lengthComputable) {
	                  $(".barColor").show();
	                 var percent = Math.floor( e.loaded / e.total * 100);
	                  console.log(percent);
	                  if(percent == 100){
	                      // $(".barColor").hide();
	                  }else{
	                      // $(".barColor").show();
	                      $('.progressInfo').css('width', (percent * 6)+'px');
	                      $('.progressInfo').html(percent + '%');
	                  }
	              }
	          };
	      }
	      return xhr;
	  }
})

原生的ajax

 xhr.upload.onprogress = Function;