2015-12-14 40 views
0

這很奇怪,我試圖找出原因。我的AJAX調用是爲什麼使async:false導致CSS無法呈現?

$('.edit-config').click(function() { 
     var that = this; 
     var msg; 
     ipt = $(this).closest('tr').find('input'); 
     $.ajax({ url: ajaxurl, 
       method: 'POST', 
       data: { 'action' : 'config_update', 'name' : ipt.attr('name'), 'val' : ipt.attr('value') }, 
       beforeSend: function () { $(that).addClass('updating').text("Updating ... "); }, 
       complete: function () { $(that).removeClass('updating').text("Update"); }, 
       success: function (submitted) { 
           if (submitted === 'true') { msg = "Successfully updated configuration in database"; } 
           else { msg = "Error when trying to update database"; } 
          }, 
       error: function () { msg = "Unspecified internal error"; } 
     }); 
     alert(msg); 
    }); 

我想改變它,這樣alert(msg);不叫後$.ajax(...)運行直到完成,因爲這就是msg首先設置。所以我加入async: false作爲參數,然後我注意到addClass('updating')正在添加類,但與該類關聯的樣式沒有顯示出來,而之前做過(async默認爲true)。

+0

簡短回答:不要使用'async:false'。 – dfsq

+0

這個問題的答案總是,從來沒有永遠永遠不會使用'async:false' *** – adeneo

+0

但我其實希望它阻止這次大聲笑 –

回答

2

因爲當你告訴它同步運行時,它會讓你唯一的線程工作。這意味着它正忙於等待網絡電話而不是響應。當網絡呼叫同步運行時,您無法執行任何事情。不要這樣做。

永遠不要使用async: false

以防萬一不明確,async: false壞了。事實上,有些瀏覽器甚至不會讓你這樣做。

如果您需要在調用後運行alert(),只需將其放入成功/錯誤回調函數中即可。

相關問題