Div auto-rafraîchissant avec jQuery - setTimeout ou une autre méthode?

Question

Comment exactement effectuez-vous un auto-actualisation div avec JavaScript (en particulier, jQuery)?

Je connais la méthode setTimeout, mais est-ce vraiment une bonne pratique? Y a-t-il une meilleure méthode?

function update() { 
    $.get("response.php", function(data) { 
     $("#some_div").html(data); 
    }); 
    window.setTimeout("update();", 10000); 
} 

Answer 1

Une autre modification:

function update() { 
    $.get("response.php", function(data) { 
    $("#some_div").html(data); 
    window.setTimeout(update, 10000); 
    }); 
} 

La différence avec c'est qu'il attend 10 secondes après l'appel ajax est un. Donc vraiment le temps entre les rafraîchissements est de 10 secondes + la durée de l'appel ajax. L'avantage de ceci est que si votre serveur prend plus de 10 secondes pour répondre, vous n'obtenez pas deux (et finalement, plusieurs) appels AJAX simultanés qui se passe.

En outre, si le serveur ne répond pas, il ne continuera pas d'essayer.

J'ai utilisé une méthode similaire dans le passé en utilisant .ajax pour gérer le comportement encore plus complexe:

function update() { 
    $("#notice_div").html('Loading..'); 
    $.ajax({ 
    type: 'GET', 
    url: 'response.php', 
    timeout: 2000, 
    success: function(data) { 
     $("#some_div").html(data); 
     $("#notice_div").html(''); 
     window.setTimeout(update, 10000); 
    }, 
    error: function (XMLHttpRequest, textStatus, errorThrown) { 
     $("#notice_div").html('Timeout contacting server..'); 
     window.setTimeout(update, 60000); 
    } 
} 

Cela montre un message de chargement lors du chargement (mettre un gif animé là-dedans pour le web typique » 2.0 "style". Si le serveur expire (dans ce cas, cela prend plus de 2 secondes) ou si un autre type d'erreur se produit, il affiche une erreur et attend 60 secondes avant de contacter à nouveau le serveur. Ceci peut être particulièrement utile lorsque vous effectuez des mises à jour rapides avec un plus grand nombre d'utilisateurs, lorsque vous ne voulez pas que tout le monde bloque soudainement un serveur en retard avec des demandes qui arrivent tout juste à expiration.

Answer 2

There's a jQuery Timer plugin vous pouvez essayer

Answer 3

function update() { 
    $("#notice_div").html('Loading..'); 
    $.ajax({ 
    type: 'GET', 
    url: 'jbede.php', 
    timeout: 2000, 
    success: function(data) { 
     $("#some_div").html(data); 
     $("#notice_div").html(''); 
     window.setTimeout(update, 10000); 
    }, 
    error: function (XMLHttpRequest, textStatus, errorThrown) { 
     $("#notice_div").html('Timeout contacting server..'); 
     window.setTimeout(update, 60000); 
    } 
}); 
} 
$(document).ready(function() { 
    update(); 
}); 

C'est un meilleur code

Answer 4

$(document).ready(function() { 
    $.ajaxSetup({ cache: false }); // This part addresses an IE bug. without it, IE will only load the first number and will never refresh 
    setInterval(function() { 
    $('#notice_div').load('response.php'); 
    }, 3000); // the "3000" 
});