仅在AJAX请求需要一定时间时才执行代码？

Question

在我的Web应用程序中,我正在使用$.ajax()请求从数据库加载数据并在浏览器中显示它.在执行请求期间,我显示如下Loading Results ...消息:

$.ajax({
    // ...
    beforeSend: function() {
        $('#loading-results-message').show();
    },
    complete: function() {
        $('#loading-results-message').hide(); 
    }
});

这很好用.但是,如果没有太多数据要加载,请求只需要几分之一秒.在这种情况下,消息也只显示几分之一秒.这个动画发生得太快,很难识别它.因此,如果只有当请求需要一定的时间,即至少几秒但不仅仅是几分之一秒时才能显示消息,那将是很好的.这有可能吗？顺便说一下,我在服务器端使用Django,如果这很重要的话.

Answer 1

使用setTimeout该请求完成时建立一个定时器,取消定时器:

var desired_delay = 2000;
var message_timer = false;
$.ajax({
    // ...
    beforeSend: function() {
        message_timer = setTimeout(function () {
            $('#loading-results-message').show();
            message_timer = false;
        }, desired_delay);
    },
    complete: function() {
        if (message_timer)
            clearTimeout(message_timer);
        message_timer = false;
        $('#loading-results-message').hide(); 
    }
});

文档

• setTimeout在MDN上 - https://developer.mozilla.org/en-US/docs/DOM/window.setTimeout
• clearTimeout在MDN上 - https://developer.mozilla.org/en-US/docs/DOM/window.clearTimeout