如何在IE中立即通過javascript設置樣式

Question

最近我遇到了IE的問題。 我有一個功能

function() {
    ShowProgress();
    DoSomeWork();
    HideProgress();
}

其中ShowProgress和HideProgress只是使用jQuery的css（）方法操縱'display'CSS樣式。

在FF中一切正常，同時我將顯示屬性更改為阻止，出現進度條。 但不是在IE中。 在我離開函數時，在IE中應用了樣式。 這意味着它從未顯示過，因為在函數結束時我只是隱藏它。 （如果我刪除了HideProgress行，則在完成執行函數后會立即顯示進度條（更確切地說，當調用函數結束時立即出現 - 因此IE中沒有其他內容））。

有沒有人遇到過這種行為？ 有沒有辦法讓IE立即應用這種風格？

我已經准備好了解決方案但是我需要一些時間來實現它。 我的DoSomeWork（）方法正在進行一些AJAX調用，現在這些調用是同步的。 我認為讓它們異步會解決問題，但我必須重新設計一下代碼，所以找到一個解決方案只是為了立即應用這個樣式會簡化得多。

謝謝rezna

Answer 1

同步請求會阻止整個UI，這很糟糕。 你的假設是正確的，但是如果你想繼續沿着這條路走到$ he​​ll的內圈，試試這個：

function () {
    ShowProgress();
    window.setTimeout(function () {
        DoSomeWork();
        HideProgress();
    }, 0);
}

請注意，我沒有測試過這個。 如果您還沒有看到任何內容，請嘗試使用超時值（當前為0 ）。

Answer 2

嘗試將HideProgress方法拋出到setTimeout中。 例如：

function() {
    ShowProgress();
    DoSomeWork();
    setTimeout(HideProgress,0);
}

即使延遲假定為0毫秒，這也會產生將HideProcess方法拋到隊列末尾的凈效果，並可能為瀏覽器提供所需的呼吸空間。

[編輯]我應該提到，如果你經常快速地調用這個方法，這個方法確實有一個缺點：競爭條件。 當另一個DoSomeWork（）正在執行時，您可能最終執行先前的超時。 如果DoSomeWork需要很長時間才能完成， 就會發生這種情況。 如果這是一個風險，您可能希望為進度條實現一個計數器，並且只有在啟動它的計數器與計數器的當前值相同時才執行HideProgress。