Jquery 旋转效果在ajax调用期间不起作用

我有以下代码。。但是，在ajax调用完成之前，旋转效应不会发生（这几乎是无用的）

但是如果我添加一个警报，它会抛出警报，然后旋转效果开始出现

$.ajax({
          type:"GET",
          async:false,
          url: "../../xxxxx/AvailabilityServlet",
          data: {action: "xxx", sku: sku},
          beforeSend: function( xhr ) {
             $("#submiticon").removeClass("fa-search");
             $("#submiticon").addClass("fa-spinner fa-spin");
             alert("stop") ;
        }

JSP:

$（“#提交”）。单击（函数（）{
searchSku（）
});

从

$.ajax

调用中删除

async:false

。您正在使其同步而不是异步（AJAX中的A），并在浏览器等待响应时挂起浏览器。

谢谢。。我只是忽略了这个属性。但是当我在调用之前（发送之前）设置对这些元素的更改时。。难道它不应该进行这些更改，然后进行服务器调用吗？对不起，如果这是一个天真的问题。。我对Ajax和Jquery的了解非常有限。感谢您的帮助。@Vasco：它会在呼叫服务器之前进行这些更改。但是，当它忙于等待服务器的呼叫返回时，它无法执行任何其他操作，包括动画。谢谢Matt。。这让我更清楚了。感谢你的耐心。

$.ajax({
          type:"GET",
          async:false,
          url: "../../xxxxx/AvailabilityServlet",
          data: {action: "xxx", sku: sku},
          beforeSend: function( xhr ) {
             $("#submiticon").removeClass("fa-search");
             $("#submiticon").addClass("fa-spinner fa-spin");
             alert("stop") ;
        }

<div class="col-md-4">
  <form role="form" class="ng-pristine ng-valid">
    <div class="input-group col-md-6" >
      <input type="text" class="form-control" id="skuInput" placeholder="Sku" autocomplete="off" >
       <span id="submit" class="input-group-addon"><span id="submiticon" class="fa fa-search"></span></span>
     </div>
  </form>
</div>

$("#submit").click(function(){
 searchSku()
});