jQuery - chỉ hiển thị hình ảnh tải nếu cuộc gọi ajax mất hơn một giây?

Question

Chỉ có thể hiển thị hoạt ảnh "Đang tải .." nếu cuộc gọi ajax mất nhiều hơn một giây? Một số cuộc gọi ajax của tôi khá nhanh nhưng tôi vẫn thấy biểu tượng tải trong một phần giây trước khi nó biến mất. Có thể chỉ là tôi, nhưng tôi thấy nó mất tập trung. Tôi không muốn loại bỏ nó hoàn toàn mặc dù. Bất kỳ đề xuất? Dưới đây là mã của tôi -

$('#loading').hide() 
    .ajaxStart(function() { 
     $(this).show(); 
    }) 
    .ajaxStop(function() { 
     $(this).hide(); 
    }); 

<div id="loading"> 
    <img alt="Loading, please wait.." src="/content/images/spinner.gif" /> 
</div> 

Answer 1

Bạn nên đặt mã của bạn trong một giờ:

var $loader = $('#loading'), timer; 

$loader.hide() 
    .ajaxStart(function() 
    { 
     timer && clearTimeout(timer); 
     timer = setTimeout(function() 
     { 
      $loader.show(); 
     }, 
     1000); 
    }) 
    .ajaxStop(function() 
    { 
     clearTimeout(timer); 
     $loader.hide(); 
    }); 

Answer 2

Bạn có thể sử dụng một setTimeout().

var loadingTimeout; 
$('#loading').hide() 
.ajaxStart(function() { 
    var element = $(this); 
    loadingTimeout = setTimeout(function() { 
     element.show(); 
    }, 1e3); 
}) 
.ajaxStop(function() { 
    clearTimeout(loadingTimeout); 
    $(this).hide(); 
});