Comment définir la durée minimale d'un appel Ajax ?

Question

J'ai un site web qui fait un appel ajax et charge ensuite un gif pour l'afficher statiquement sur une TV. Mais pour l'instant, les appels ajax ne prennent pas assez de temps pour que l'effet soit vraiment visible. Je me demandais donc s'il y avait un moyen de définir le temps minimum que l'appel ajax prendrait ?

Vous pouvez voir le site web J'essaie de me faire une meilleure idée de ce que je fais. Essayez de cliquer sur le cadre de droite ou sur le phonographe sur la table.

    <script type="text/javascript">
    var minDelay = 1000;
    var start = new Date();
    $.get("form.html", function(result) {
        callback($(result).find("#contact"));
        var end = new Date();
        var timeInMilliseconds = end - start;
        if (timeInMilliseconds  < minDelay) {
            setTimeout(function() { callback(result); }, minDelay - timeInMilliseconds );
        }
        else callback(result);
    });
    $.get("music.html", function(result) {
        callback($(result).find("#music"));
        var end = new Date();
        var timeInMilliseconds = end - start;
        if (timeInMilliseconds  < minDelay) {
            setTimeout(function() { callback(result); }, minDelay - timeInMilliseconds );
        }
        else callback(result);
    });

    function callback(result) {
        $("#screen").html(result);
    }
</script>

Answer 1

Vous pouvez chronométrer les points de départ et d'arrivée, puis ajouter un délai supplémentaire s'il est inférieur à un certain seuil (à l'aide de la fonction setTimeout ). Voici ce qu'il en est :

var minDelay = 1000;
var start = new Date();
$.get(url, function(result) {
    var end = new Date();
    var timeInMilliseconds = end - start;
    if (timeInMilliseconds  < minDelay) {
        setTimeout(function() { callback(result); }, minDelay - timeInMilliseconds });
    }
    else callback(result);
});

function callback(result) {
    // Ajax response handling here ...
}

---

Editer Je ne suis pas sûr que vous puissiez y parvenir en utilisant la fonction load (selon le documents la cible est mise à jour immédiatement après la réception de la réponse du serveur). Je suggère de convertir le load appelle en gets . C'est-à-dire ceci :

$("#screen").load("form.html #contact");

Il devrait devenir ceci :

$.get("form.html", function(result) {
    callback($(result).find("#contact"));
});

Et le callback que j'ai créée ci-dessus devrait alors remplir la cible de load .

 function callback(html) {
     $("#screen").html(html);
 }

Answer 2

Vous pouvez utiliser un setTimeout() dans la méthode ajax callback pour simuler un délai ? Le site web est plutôt sympa !

Exemple de code :

var minDelay = 500;//half a second
setTimeout(DelayTimePassed, minDelay);
//make Ajax Call

function DelayTimePassed()
{
if(dataAvailable)
//show Data
else
//show data as soon as available
}

function AjaxCallback()
{
if(showDataAsSoonAsAvailable)
//Show Data Now
else
dataAvailable=true;//show data after time delay passes
}

J'espère que cela a du sens pour vous - deux méthodes vérifient quelques variables bool globales pour décider quand afficher les données.