将ajax异步设置为false时，无法看到页面加载器图像

Question

我正在ajax调用之前显示加载图像，并在成功到达时将其隐藏。

$('#Search').on('click', function (e) {

    $('#loaderImg').show();

    $.ajax({
        url: '',
        data: '',
        async: false,
        success: function (response) {

            ...some lines of code

            $('#loaderImg').hide();

        }  
    });
});

如果async为false，则不会显示图片，这可能是因为在执行javascript时未更新UI。

当异步设置为true时，在隐藏成功块之前，图像是可见的。

请提出一种在成功执行块之前使图像可见的方法，以保持async参数为false。

在Chrome中测试。

Answer 1

您是否尝试过全局ajaxStart和ajaxStop事件：

$('#loaderImg').bind('ajaxStart', function(){
      $(this).show();
 }).bind('ajaxStop', function(){
      $(this).hide();
 });