如何在顯示confirm（）對話框之前立即強制jQuery中的樣式更改？

Question

這裏的jsfiddle鏈接：https://jsfiddle.net/67kaphgu/

$(document).ready(function(){ 
    $("DIV").css("background-color","red"); 
    confirm("Background not yet changed"); 
}); 

總之，我想強調的一些元素，讓你確認，然後再繼續。但該元素在confirm()調用返回後更改其樣式。

Answer 1

問題是因爲confirm()調用阻止UI線程更新。一個解決辦法是放在一個setTimeout()的confirm()電話用很短的延遲：

$(document).ready(function(){ 
    $("div").css("background-color", "red"); 
    setTimeout(function() { 
     confirm("Background not yet changed"); 
    }, 50); 
}); 

Updated fiddle

另一種方法是使用一種與模態替換confirm()箱庫，從而使任何時候UI都可以自由更新。