JQuery загрузки изображения при асинхронном false

Question

Я хочу дать вращающееся изображение в формате gif, чтобы пользователь знал, что что-то происходит, когда я выполняю вызов ajax с jquery. Я должен использовать async: false, потому что в противном случае код запутается, и мы получим плохую переменную сеанса. Вот что у меня есть (это не показывает gif до тех пор, пока экран не заморозил вызов.)

$('#status' + itemNum).html("<img width='14px' src='/style/images/spinner.gif'>");
if (foo == "bar") {
$.ajax({
   type:"POST",
   url: "foobar.html",
   async:false,
   data: "val1=" + escape(newValue) + "&val2=" + fieldName + "&val3=" + newValue2
   })
} else {
$.ajax({
   type:"POST",
   url: "foobar.html",
   data: "val1=" + escape(newValue) + "&val2=" + fieldName + "&val3=" + newValue3
   })
   document.getElementById('status' + itemNum).innerHTML = "SAVED";
}
$("#status" + itemNum).show();
setTimeout("fade_out('"+itemNum+"')", 1000);
}

В этом случае я хочу только асинхронную, когда foo = bar. Может кто-нибудь сообщить мне, почему spinner.gif загружается после звонка. Я думаю, что это может быть потому, что спиннер больше нигде и задержка загрузки, но все равно он не появляется при многократном вызове (к тому времени должен быть в кеше), так что я в замешательстве.

Спасибо!

Answer 1

Это невозможно.
Поскольку Javascript работает в потоке пользовательского интерфейса, async: false остановит браузер, включая всю анимацию.

---

Выполните , а не используйте async: false!

Вам нужно исправить свой код для обработки асинхронных запросов.

Answer 2

async: false заблокирует браузер, в результате чего все анимации будут приостановлены до тех пор, пока обработка не будет продолжена. Однако вы можете получить изображение, по крайней мере, отображаемое перед вызовами ajax, разместив вызовы ajax внутри setTimeout с задержкой 1 мс или более. Он все равно не будет анимирован, хотя это анимированный GIF.

---

Конечно, вышеупомянутое является просто бинтом, лучшим решением было бы не использовать async: false.