How to cancel a jquery.load()?
If you want any custom handling such as this, you simply can't use the jQuery.load() function. You'll have to upgrade to jQuery.ajax(), which I recommend anyway since you can do so much more with it, especially if you need any kind of error handling, it will be necessary.
Use the beforeSend option for jQuery.ajax and capture the xhr. Then you can create callback which can cancel the xhr after your timeout, and the callbacks as necessary.
This code is not tested, but should get you started.
var enableCallbacks = true;
var timeout = null;
jQuery.ajax({
....
beforeSend: function(xhr) {
timeout = setTimeout(function() {
xhr.abort();
enableCallbacks = false;
// Handle the timeout
...
}, 5000);
},
error: function(xhr, textStatus, errorThrown) {
clearTimeout(timeout);
if (!enableCallbacks) return;
// Handle other (non-timeout) errors
},
success: function(data, textStatus) {
clearTimeout(timeout);
if (!enableCallbacks) return;
// Handle the result
...
}
});
Your rephrased secondary question:
How do I cancel pending callback functions, created using the .load() method?
You can cancel all jquery callbacks, by using this 'nuclear' option:
$('#myImage').unbind('load');
I think the simplest thing to do would be to use $.ajax
directly. That way you can start a timeout, and from the timeout set a flag that the handler on the ajax call can check. The timeout can also show a message or whatever.