Set timeout on third-party file request with jQuery
- by markedup
I'm trying to integrate a script file hosted by a third party into a new web site.
Currently, I'm adding a SCRIPT tag to the DOM for that third-party script file on document ready:
$(document).ready( function() {
var extScript = document.createElement('script');
extScript.type = 'text/javascript';
extScript.src = 'http://third-party.com/scriptfile.js';
$('head').append(extScript);
});
function extScriptCallback() {
$('#extWidgetContainer').show();
}
But sometimes that third-party script file request times out or takes a long time to respond.
So, for the sake of best practice, I want to provide alternative content if the external script takes longer than e.g. 10 seconds to load.
How do I achieve this? I've looked at JavaScript's native setTimeout(), as well as jQuery's delay() function, but I'm not sure which I should use--or how.
Grateful for any suggestions.