Question

我正在使用jQuery来使用this approach对ASP.NET后端的AJAX调用。我使用.ajaxStart和.ajaxStop来显示和隐藏进度指示器。当AJAX请求非常快地完成时，进度指示器“闪烁”，因为它没有显示足够长的时间。

一种可能的解决方案是仅在最短时间后显示（如MS AJAX中的UpdateProgress.DisplayAfter）。另一种方法是确保指标显示最短时间。不幸的是，jQuery Pause plug-in似乎不起作用，像this这样的效果延迟技巧也不起作用。基于类似于this SO answer的JavaScript setTimeout的某种解决方案似乎最有可能，但问题是Ajax调用会继续处理。因此，当进度指示器仍然可见时，将显示结果。

那么，可以吗？如果是这样，怎么样？

Answer 1

在使用带有进度指示器的Ajax的项目的早期阶段，当然你会有一个闪烁效果，因为你（希望）在你测试时没有处理大量数据。随着您的项目获得越来越多的数据，您会发现，进度指示器将保持更长和更长时间。我不建议故意创建一个延迟来保持进度指示器，因为它会降低用户体验。尝试使用javascript setTimeout（）函数。

Answer 2

尝试以下方法：

$("#spinner")
    .bind("ajaxSend", function() {
            $(this).fadeIn(1000);
    })
    .bind("ajaxComplete", function(){
        $(this).stop();
        $(this).hide();
    });

这个想法是你在时间延迟（在这种情况下为1000）中淡入微调器并取消动画并隐藏在ajaxComplete上。

如果你想做延迟表演，你可以尝试使用animate（）而不是fade（）并链接调用（例如$（this）.animate（/ *这里的东西* /）。show（））< / p>

希望这有帮助！

如何使用jQuery ajax避免快速结果的“闪烁”进度？

2 个答案: