Загрузка изображения в ajax-вызов не работает в chrome

Question

У меня есть html-страница, где я хочу отображать обработку с loading image между ajax call для сохранения и ее успеха. И эта страница я вкладываю в динамику crm как webresourse.

Проблема в том, что загрузка работает отлично в mozilafirefox, но не работает в хром.

Сценарий:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 

Другой Код:

<img src="sm_loading.gif" id="loading" style="display:none" /> 
<input class="custom-btn" id="btnsave" value="Save" onclick="SaveData();" type="button"> 
function SaveData() { 
    $('#loading').show(); 
    var stocktrack = {}; 
    stocktrack.sm_Description = descval; 
    var jsonPO = window.JSON.stringify(stocktrack); 
    var oDataUri = serverUrl + "/XRMServices/2011/OrganizationData.svc/sm_stocktrackingSet"; 
    $.ajax({ 
     type: "POST", 
     contentType: "application/json; charset=utf-8", 
     datatype: "json", 
     url: oDataUri, 
     data: jsonPO, 
     async: false, 
     beforeSend: function (XMLHttpRequest) { 
      XMLHttpRequest.setRequestHeader("Accept", "application/json"); 
     }, 
     success: function (data, textStatus, XmlHttpRequest) { 
      debugger; 
      $('#loading').hide(); 
     }, 
     error: function (XMLHttpRequest, textStatus, errorThrown) { 
      alert(textStatus); 
     } 
    }); 
} 

Просьба предложить, если какое-либо решение есть.

Answer 1

Я получил свой ответ.

С помощью setTimeout (function() {.. наш код ..}, 10); Я могу отображать загрузку в хром с помощью async: false.

Ссылка Ссылка:

https://www.experts-exchange.com/questions/25187194/jQuery-async-false-with-beforeSend.html

Answer 2

Я запустил ваш код в Firefox, и он сработал. Я также работал в Chrome и ничего не получал, как вы сказали. Однако, включив отладчик в Chrome, используя F12, я получил следующую ошибку.

Синхронный XMLHttpRequest в основной теме устарел из-за его пагубных последствий для конечного пользователя. Для получения дополнительной помощи проверьте https://xhr.spec.whatwg.org/.

Чтобы исправить этот набор, асинхронный флаг внутри вашего вызова ajax равен true.

Если вы хотите, чтобы пользователь не нажимал кнопки во время вашего асинхронного вызова, что совершенно понятно, я предлагаю вам использовать прозрачный блокирующий слой.

Answer 3

Загрузка панель работает только с асинхронномом: Правда, Других мудрым он будет работать только на Firefox и большинство других браузеров не показывает загрузку панели. Но с асинхронным ложным будет выполняться весь код ниже, кроме успеха и ошибки (функции обратного вызова).