загрузочный экран на jquery ajax звонок не идет

Question

Я хочу показать экран загрузки при выполнении вызова ajax и скрыть экран загрузки после завершения вызова ajax. Я написал код для него, но он работает только в Mozilla. Я хочу, чтобы он работал во всех браузерах. Мой HTML-код похож на

<div id="loadScreen" style="display: none;width: 100%; height: 100%; top: 0pt;left: 0pt;">
   <div id="loadScr" style="filter: alpha(opacity = 65);  z-index: 9999;border: medium none; margin: 0pt; padding: 0pt; width: 100%; height: 100%; top: 0pt;left: 0pt; background-color: rgb(0, 0, 0); opacity: 0.2; cursor: wait; position: fixed;"></div>
   <div id="loader"  style="z-index: 10000; position: fixed; padding: 0px; margin: 0px;width: 30%; top: 40%; left: 35%; text-align: center;cursor: wait; ">
     <img src="IMG/ajax-loader.gif" alt="loading" />
   </div>
</div>

и кодировка jquery-

$.ajax({
   cache: false,
   beforeSend: function () {
     $('#loadScreen').show();
   },
   type: "POST",
   async: false,
   url: serviceUrl,
   data: jsonData,
   contentType: "application/json; charset=utf-8",
   dataType: "json",
   complete:function(){
     $('#loadScreen').hide();
   },
   success: function (result) {
     ProcessAjaxResponse(result);
   },
   error: function (errorMsg) {
     //TODO:Lets see
   }
});

Answer 1

Покажите свой экран перед вызовом ajax и поместите вызов ajax в обратный вызов show.Это обеспечит обновление экрана непосредственно перед вызовом ajax.

$('#loadScreen').show(function() {
    $.ajax({
        cache: false,
        beforeSend: function() {
            //now happens above
        },
        type: "POST",
        async: false,
        url: serviceUrl,
        data: jsonData,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        complete: function() {
            $('#loadScreen').hide();
        },
        success: function(result) {
            ProcessAjaxResponse(result);
        },
        error: function(errorMsg) {
            //TODO:Lets see
        }
    });
});