在MVC中使用jQuery ajax上传文件进度
本文关键字:文件 ajax jQuery MVC | 更新日期: 2023-09-27 18:13:15
我上传文件使用jQuery拖放没有任何问题。但我想显示上传文件的百分比(显示上传进度条)如何在jQuery ajax中实现?
$('#drag-target-selector').on('dragenter', function (e) {
console.log('dragenter');
e.stopPropagation();
e.preventDefault();
$(this).css('border', '2px solid #0B85A1');
});
$('#drag-target-selector').on('dragover', function (e) {
console.log('dragover');
e.stopPropagation();
e.preventDefault();
});
$('#drag-target-selector').on('drop', function (e) {
console.log('drop');
$(this).css('border', '2px dotted #0B85A1');
e.preventDefault();
var files = e.originalEvent.dataTransfer.files;
var frmData = new FormData();
for (var i = 0; i < files.length; i++) {
frmData.append("file[" + i + "]", files[i]);
}
$.ajax({
url: '@Url.Action("UploadFile")',
type: 'post',
data: frmData,
contentType: false,
processData: false,
success: function (rdata) {
console.log('result =' + rdata);
}
});
});
可以使用Uplodify或Uploadifive HTML5版本。上传文件时显示进度条