阿贾克斯装载机图片：如何设置在此期间，装载器显示的最小时间？ [英] Ajax loader image: How to set a minimum duration during which the loader is shown?

问题描述

我使用jQuery的Ajax功能，并使用加载图标，表示该数据被检索的用户。然而，我希望用户看到装载机图标的至少1秒，即使数据时间小于1s检索（如果超过1s是必需的，加载器图标应该保持在整个持续时间。

I am using Jquery for Ajax functionality, and using a loader icon to indicate to the user that data is being retrieved. However, I want the user to see the loader icon for at least 1s, even if the data takes less than 1s to retrieve (if more than 1s is required, the loader icon should remain for the entire duration.

下面是code的装载HTML

Here is the code for the loader HTML

＆LT; IMG ID =加载SRC =example.com/images/ loader.gif的风格=垂直对齐：中间;显示：无/＆GT;

<img id="loader" src="example.com/images/ loader.gif" style="vertical-align: middle; display: none" />

我使用jQuery阿贾克斯功能，我的数据处理。

I am using the Jquery .Ajax function for my data processing.

推荐答案

我会用，在2开始，1秒后递减计数器，当Ajax响应进来的东西沿着这些路线：

I would use a counter that starts at 2 and is decremented after 1 second and when the ajax response comes in. Something along these lines:

var counter = 2;
function decrement() {
  if (--counter == 0) {
    $('#loader').hide();
  }
}
setTimeout(decrement, 1000);
$.ajax(..., complete: decrement);

这篇关于阿贾克斯装载机图片：如何设置在此期间，装载器显示的最小时间？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！