jquery在ajax調用之前不執行css命令

Question

我編寫了一個簡單的代碼，它可以在DOM中的幾個項目上循環，並通過AJAX調用將它們添加到CART中。

問題是，應該在動作開始時顯示的動畫未在Chrome中顯示（在Firefox中可以！）。

這是代碼：

$(document).on('click','.btn_add_cart', function() { 

    $("#wait").css('opacity',1); //starts an animation 

    $(".one_item").each(function(index, value) { 

     var post_data = { 
      //some post data 
     }; 
     $.ajax({      
      type: "POST", 
      dataType: "json", 
      url: "/ajax/Add_to_cart", 
      data: post_data,      
      success: function(res){ 
      //do some code 
      } 

     });   

    }) 

    //stop the animation 
}) 

我缺少什麼？

Answer 1

的$（document）。在（ '點擊'，函數（）{

$（ 「＃等待」），CSS（ '不透明'，1） 'btn_add_cart'; //開頭動畫

的setTimeout（函數（）{

var flag = 0; 

$（）每個（函數（指數，值）{

var post_data = { 
     flag = 1; 
    }; 
    $.ajax({      
     type: "POST", 
     dataType: "json", 
     url: "/ajax/Add_to_cart", 
     data: post_data,      
     success: function(res){ 
     //do some code 
     } 

    });   

}） 「one_item。」;

 if(flag == 1) { 
     //stop the animation 
     $("#wait").css('opacity',0); 

    } 
    } 

}，1000）;

}）