如何设置Ajax调用的最短持续时间？

Question

我有一个网站进行ajax调用,然后加载一个gif来在电视上显示静态.但是现在ajax调用没有足够的时间让效果真正流行起来.所以我想知道是否有办法设置ajax调用的最短时间？

你可以看到我想要的网站,以便更好地了解我在做什么.尝试单击右侧相框或桌面上的留声机.

    <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

您可以计算起点和终点,然后在低于某个阈值(使用setTimeout)时添加另一个延迟.像这样的东西:

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 ...
}

编辑我不确定你是否可以使用JQuery实现这一点load(根据文档,目标在从服务器收到响应后立即更新).我建议把load电话转换成gets.即,这个:

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

应该成为这样的:

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

而callback我上面编写的函数应该填充目标load.

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