我有一个ajax上传脚本,当用户上传文件时会调用它,并且一切正常,成功运行了一些功能,一切都很好。
但现在我的问题是
在服务器端,它将在Python中对上传的文件做一些不同的事情,我将向用户显示。 诸如“正在编译”,“正在读取数据库”等等,并且这种情况会在彼此之后一次发生。
$(document).ready(function() {
$("#chkPassport").click(function () {
if ($(this).is(":checked")) {
$("#div_id").show();
} else {
$("#div_id").hide();
}
});
$('#uploadform').on('submit', function(event) {
// Disable upload button when pressed.
$("input[type=submit]").attr("disabled", true);
event.preventDefault();
var formData = new FormData($('#uploadform')[0]);
$.ajax({
xhr : function() {
var xhr = new window.XMLHttpRequest();
var run_once = 0;
$("#alertsuccess").hide();
$("#alertcompile").hide();
//$('#testa').text(3 + '%');
$('#progressBar').attr('aria-valuenow', 0).css('width', 0 + '%').text(0 + '%');
$('#progressBar').show();
xhr.upload.addEventListener('progress', function(e) {
if (e.lengthComputable) {
console.log('Bytes Loaded: ' + e.loaded);
console.log('Total Size: ' + e.total);
console.log('Percentage Uploaded: ' + (e.loaded / e.total));
var percent = Math.round((e.loaded / e.total) * 100);
if(percent > 99 && run_once == 0){
$("#alertsuccess").hide();
$("#alertsuccess").text("* Finishing up...");
$('#alertsuccess').fadeIn('slow');
run_once = 1;
}
$('#progressBar').attr('aria-valuenow', percent).css('width', percent + '%').text(percent + '%');
}
});
return xhr;
},
type : 'POST',
url : '/uploader',
data : formData,
processData : false,
contentType : false,
success : function() {
$("input[type=submit]").attr("disabled", false);
$('#progressBar').attr('aria-valuenow', 0).css('width', 0 + '%').text(0 + '%');
$("#alertsuccess").text("* Files uploaded succesfully!");
$.ajax({
url: '/home',
type: 'GET',
cache: false,
async: false,
data: 'state',
success : function(){
if(state == 1){
$("#alertsuccess").text("* OK ALL DONE");
}
setTimeout(function(){
$('#alertcompile').fadeIn('slow');
$("#alertcompile").text("* Compiling...");
}, 2000);
setTimeout(function(){
$("#alertcompile").text("* Downloading...");
//downloadFile("http://127.0.0.1:5000/static/downloads/software/test.trf");
}, 5000);
setTimeout(function(){
$("#alertcompile").fadeOut('slow');
}, 7000);
setTimeout(function(){
$("#alertsuccess").fadeOut('slow');
}, 7500);
}
});
succsessUpload();
window.location.href = "/uploader_done";
$("#alertcompile").hide();
$('#alertcompile').fadeIn('slow');
}
});
});
});
现在,我用setTimeout
模拟答案。取而代之的是我想要实际的数据,但是我不知道如何使它工作。