因此，我在代码中发现了一个有趣的错误。首先，代码本身：
$('#form').on('submit', function(event) {
event.preventDefault();
// Configure Ajax call only if the user is online at the time of submit event
if (navigator.onLine) {
// Tab closing detection event enable - implemented to stop the user from accidentaly closing the tab during upload
$(window).on('beforeunload', function() {
return "Closing message"
})
var post_data = new FormData($("#form")[0]);
xhr = $.ajax({
xhr: function() {
var xhr = new window.XMLHttpRequest();
var started_at = new Date();
xhr.upload.addEventListener("progress", function(evt) {
if (!navigator.onLine && xhr.readyState < 4) {
// sub-routine making sure that the user is online during upload start
xhr.abort()
alert("Network connection was lost. Data upload has been aborted, and data already transfered might have been corrupted. Please restore your connection and try again.")
} else {
// Executed if the user remains online
transferOn = true
}
}, false);
xhr.upload.addEventListener("abort", function() {
// Instructions re-enabling the form after an Ajax abort event was executed
formUnlock('#submit_button', serial_id, false)
disableTags(false)
});
return xhr;
},
url: '#',
type: "POST",
data: post_data,
processData: false,
contentType: false,
dataType: "json",
timeout: 1500000, // timeout of 25 minutes for a request - to be tweaked to be in line with Apache settings!
error: function(xhr, status) {
xhr.abort()
transferOn = false
// Check if the source of error is an Ajax timeout event, if not then
// check if xhr.status is defined in $.ajax.statusCode
// if true, return false to stop this function
if (status === 'timeout') {
alert("Data transfer time has exceeded 25 minutes. A timeout event has been triggered.")
} else if (typeof this.statusCode[xhr.status] != 'undefined') {
return false;
} else {
// else print out this alert
alert("Error code " + xhr.status + " returned by the server.\n\nTHE UPLOAD ATTEMPT WAS NOT SUCCESSFUL!\n\nPlease try again or contact website's support.");
}
},
statusCode: {
0: function() {
alert("Error code 0: AJAX request was cancelled.");
},
404: function() {
alert("Error code 404: Page not found.");
},
408: function() {
alert("Error code 408: Request Timeout.");
},
413: function() {
alert("Error code 413: Request Entry Too Large.");
},
500: function() {
alert("Error code 500: Internal server error");
}
},
success: function(response) {
// Lift of the transferOn flag, which prevents main control loop (enabling PR/SR-file/tag/text input fields sequentially)
transferOn = false
}
});
} else {
alert('You are offline - file transfer cannot be initiated. Please check your connection and try again.')
}
})
这个想法是，当Ajax调用超时时，应该按照确切的顺序执行以下操作： 1）中止XHR 2）将transfer On标志设置为false 3）执行formUnlock（）函数 4）根据错误的状态，调用警报窗口之一 5）执行statusCode的内容 6）休息。
该命令由Internet Explorer执行，但不由Chrome执行。 Chrome似乎如下执行它：
4）根据错误状态，调用警报窗口之一 5）执行statusCode的内容 1）中止XHR 2）将transfer On标志设置为false 3）执行formUnlock（）函数 6）休息。
我真的很困惑，欢迎任何人对我做错事情的建议。