jQuery: timeout su chiamate ajax

Un problema classico e particolare della chiamata ajax potrebbe essere legato al timeout della chiamata.

Potremmo ipotizzare che dopo un po’ non siamo disposti ad aspettare oltre il server e procederemo con un messaggio di errore.

Nel nostro caso fissereme questo timeout a un secondo.

Riutilizzaremo ancora una volta la nostra struttura consolidata:

<h2>Premi il pulsante per effettuare una richiesta ajax.</h2>
<button id="trigger">GET</button><br>
<div id="target"></div>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
$(document).ready(function() {
$('#trigger').click(function() {
...
});
</script>

E andiamo a impostare la chiamata ajax specificando un timeout:

$.ajax({url: 'sleep', timeout : 1000})

quello che succederà dopo sarà gestito dalle funzioni done() e fail() in modo tradizionale

.done(function(data, xhr) {
$('#target').append('ok: ' + data);
})
.fail(function(xhr, text, error) {
$('#target').append('Timeout: ' + error);
});

Nel nostro caso non trovando la url, andrà in timeout

L’esempio