javascript - 仅当 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

Answer 2

我和@chris 一起讨论这个解决方案。但也值得您花时间研究一下http://api.jquery.com/jQuery.ajaxSetup/

这将使您不必为每个请求编写超时。