javascript - 带有 ajax 请求的加载程序图像不会显示在 chrome 上

Question

我有一个 ajax 请求，它在 ajax 发送之前显示加载程序图像，并在请求成功时在 ajax 之后隐藏加载程序图像。加载程序图像在 Firefox 上显示完美，但在 chrome 上显示不佳。

My code is working on Firefox

我的代码是..

$.ajax({
  method: "GET",
  url: "test.php",
  beforeSend:function(){
    $(".loader-image").show();
  },
  success:function(data){
    $(".loader-image").hide();
    //here i write success code
  }

});

Answer 1

希望对你有帮助

I had the same issue and i really don't know how it's happening, but it can be fixed using a small delay in code like follows.

解决方案1

$.ajax({
  method: "GET",
  url: "/",
  beforeSend:function(){
    $(".loader-image").show(1);
    // please note i have added a delay of 1 millisecond , which runs almost same as code with no delay.
  },
  success:function(data){
    $(".loader-image").hide();
    //here i write success code
  }

});

解决方案2

   $.ajax({
      method: "GET",
      url: "/",
      beforeSend:function(){

        setTimeout(function(){
           $(".loader-image").show();
        }, 1);
        // please note i have added a delay of 1 millisecond with js timeout function which runs almost same as code with no delay.
      },
      success:function(data){
        $(".loader-image").hide();
        //here i write success code
      }

    });