크롬 ajax loading image(Ajax loader image is not showing up in chrome)

$ajax 를 사용해서 프로그래밍을 하곤 한다. 

최근들어 ajax로 서버 데이터를 호출하는 부분이 간혹 느려졌는데, 로딩 이미지가 없다보니 

사용자가 응답이 없는 것으로 생각할 수도 있겠단 생각이 들었다. 

서버로 POST 방식으로 호출하는 부분은 로딩 이미지가 되어 있었는데, $ajax로 호출하는 부분은 그런 내용이 없다보니, 생겼던 문제였다. 

$ajax 앞에 로딩 이미지를 보여주는 것을 추가하고, $ajax 완료 후에 로딩 이미지를 숨기는 코딩을 추가했었다. 

.

그런데 explorer에서는 정상적으로 작동하던 것이 크롬에서는 ajax 호출이  끝난  다음에 로딩 이미지가 나왔다.  

$.ajax({

        url: "url",

        type: "POST",

        data: {

        submitType:"", 

        },

        contentType: "application/x-www-form-urlencoded;charset=EUC-KR",

        dataType: "json",

        success: function (data) {

        },

        beforeSend:function(){

        document.all.waitBox.style.display = "block";

        },

        complete:function(){

        document.all.waitBox.style.display = "none";

        },

      error: function(error){ 

      alert(error);

        } 

    });

한참 테스트를 하다가 아래와 같이 했을 때 익스플로러와 같이 정상적으로 호출이 되었다. 

.

$.ajax({

        url: "url",

        type: "POST",

        async: true,

        data: {

        submitType:"", 

        },

        contentType: "application/x-www-form-urlencoded;charset=EUC-KR",

        dataType: "json",

        success: function (data) {

        },

        beforeSend:function(){

        document.all.waitBox.style.display = "block";

        },

        complete:function(){

        document.all.waitBox.style.display = "none";

        },

      error: function(error){ 

      alert(error);

        } 

    });

이렇게 하면 크롬에서도 로딩 이미지를 정상적으로 보이게 할 수 있다. 

.