用jquery.css修改的元素樣式在Chrome上沒有刷新

我在更改事件發生時使用.css更新select元素的寬度。在HTML：用jquery.css修改的元素樣式在Chrome上沒有刷新

<select name="city_search" id="city_search" onchange='resetDropDown("#state_search");'> 
<select name="state_search" id="state_search" onchange='resetDropDown("#city_search");'>

在JS

function resetDropDown(elementObj) 
{ 
    var selectBoxWidth = $(elementObj).attr('id') == 'college_search' ? 143 : 113; 
    $(elementObj).css({width:selectBoxWidth}); 
}

出於某種原因，該屬性寬度被正確地改變時，但是直到元件被檢查或頁面被刷新鉻不顯示變化。是否有強制使用chrome顯示應用於元素樣式的更改的方法？

在此先感謝。 Elizabeth

來源

2012-08-13 elizabethr

似乎工作：http://jsfiddle.net/cZf3A/ – Andy 2012-08-13 15:54:39

這個問題可以通過強制webkit重新繪製/重繪樣式更改來解決。你可以參考這個答案：https://stackoverflow.com/a/3485654/567101

來源

2012-08-13 16:03:13 abhidsm

非常感謝。強制webkit重繪元素工作正常。 – elizabethr 2012-08-13 17:40:56

OnChange事件僅在對象更改和散焦時觸發。您可以使用一些解決方法，比如使用鍵入事件來輸入文本或單擊事件複選框。根據選擇更改的上下文，您可能需要手動觸發更改事件。我建議onclick而不是onchange應該爲你工作，如果你的select元素在用戶選擇不同的選項時改變。

來源

2012-08-13 16:02:17

非常簡單的解決方案爲我工作。嘗試將$(document).ready更改爲$(window).load

問題可能出在準備好文檔上。如果函數在窗口加載後運行，那麼它可能會工作。

來源

2016-09-01 21:35:45

回答

相關問題