如何強制Android互聯網瀏覽器立即顯示樣式更改

我製作了一個簡單的flashcards HTML應用程序，並且遇到了我的Samsung Galaxy Tab2 7.0平板電腦上的Android互聯網瀏覽器（默認安裝）下行爲的奇怪問題。當元素樣式發生變化時，如如何強制Android互聯網瀏覽器立即顯示樣式更改

$(".question").css('color', '#FFFFFF') 
$(".answer").css('color', '#FFFFFF') 
$(".tag").css('background-color', '#FFFFFF')

瀏覽器不會立即對顯示進行任何更改。後來在代碼中，我將替換容器的文本並計算大小以使文本適合元素。我希望這個過程是隱形的（這就是爲什麼我想要做白皙白的原因）。我無法隱藏元素，因爲計算不起作用。

我已經在Windows 7下使用Chrome和IE9測試過了，它在那裏效果很好。所以Android瀏覽器存在一些問題。當我將測試代碼alert('debug');放在上面的行後面時，Android瀏覽器會顯示消息，但元素上的顏色沒有變化，但Windows 7下的瀏覽器會按預期顯示具有白色 - 白色元素的消息。

如何強制Android瀏覽器立即反映這種風格變化？有一些腳本功能可用於此，或一些<meta>標籤，可以解決這個問題嗎？請指教。

來源

2012-10-12 Ωmega

它可以在其他Android瀏覽器上工作嗎？就像在不同的Android設備上一樣......你也可以嘗試將隱藏的可見性設置爲隱藏，所以空間仍然存在，或者你可以將它放置在絕對的位置，並將它從屏幕上移開或嘗試將這些CSS放入一個類中，然後添加類 – Huangism

@黃色 - 不，它不。 Chrome工作正常。 –

當你說你想「立即顯示樣式變化」，我猜你的意思是你的腳本將繼續執行，並且你希望屏幕更新。

您需要使用continuations。而不是讓腳本繼續執行，您需要屈服並繼續。您可以通過將代碼分解爲多個函數來完成這項工作，並通過爲下一個部分設置超時來完成每個部分。這是一個簡單的例子。當循環完成時，所有的x都會一次出現。使用連續時，一次出現一個x。

<html> 
<script> 
function using_a_loop() { 
    var e = document.getElementById('spot'); 
    for (var i = 0; i < 1000; ++i) { 
     e.innerText += ' x'; 
    } 
} 

function using_continuations(i) { 
    var e = document.getElementById('spot'); 
    i = i || 0; // start at 0 when i not provided 
    e.innerText += ' x'; 
    ++i; 
    if (i < 1000) { 
     setTimeout(function() { using_continuations(i); }, 0); 
    } 
} 
</script> 
<div id="spot">X marks the spot:</div> 
<button onclick="using_a_loop()">use a loop</button> 
<button onclick="using_continuations()">use continuations</button> 
</html>

來源

2012-10-13 05:22:15 Vroo

'setTimeout'製作了一個竅門。謝謝。 –

如何強制Android互聯網瀏覽器立即顯示樣式更改

回答

相關問題