延迟加载微调，而这样做的Ajax请求jQuery中 [英] Delaying the loading spinner while doing ajax requests in jQuery

问题描述

我用下面的样机展示我的加载微调，而这样做在我的jQuery code AJAX请求：

I'm using the following mockup to show my loading spinner while doing AJAX requests in my jQuery code:

jQuery.ajaxSetup({
beforeSend: function() {
    $('#loader').show()
},
complete: function(){
    $('#loader').hide()
},
success: function() {
    $('#loader').hide()
}
});

这code工作完全正常，我！

This code works perfectly fine for me!

只有一个问题：

某些请求只是非常简单和快速，所以装载微调只是显示为一对夫妇的的毫秒。那当然是不太pretty的。

Some requests are just very simple and fast, so the loading spinner is just shown for a couple of millisecs. That of course isn't very pretty.

所以我试图用的setTimeout（）显示加载微调稍有延迟。我希望它只是弹出当AJAX请求至少需要，比方说100毫秒，但没有奏效。

So I tried using setTimeout() to display the loading spinner slightly delayed. I want it to only pop up if the AJAX requests takes at least, let's say 100ms, but it didn't work.

所以，我需要一些code延迟加载微调正如我前面解释的，所以只弹出，而做长AJAX请求！

So I need some code to delay the loading spinner as I explained above, so it ONLY pops up while doing "longer" AJAX requests!

推荐答案

这是我如何解决你提到的功能

This is how I resolved your mentioned functionality

    var loading;
    $("#loader").hide();
    jQuery.ajaxSetup({
        beforeSend: function() {
             loading= setTimeout("$('#loader').show()", 300);
        },
        complete: function(){
             clearTimeout(loading);
             $("#loader").hide();   
        },
        success: function() {
             alert("done");
        }
    });

这篇关于延迟加载微调，而这样做的Ajax请求jQuery中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！