在DOM刷新之後用jQuery測量寬度（）。

Question

我的腳本動態創建了一個<ul>寬度左浮動<li> s裏面：它是一個分頁程序。之後，腳本會測量所有<li> s的寬度並對其進行總結。

問題是，在將節點注入文檔之後 - 瀏覽器刷新DOM並應用需要一段時間的CSS樣式。它對我的腳本有負面影響：當我在測量寬度之前這些操作沒有完成時 - 我的腳本獲得了錯誤的值。如果我在一秒之內執行這項措施 - 一切都很好。

我正在尋找的東西是一種方式來檢測<ul>完全繪製，應用樣式和寬度已穩定的時刻。或者至少有一種方法來檢測每個尺寸的變化。當然，我可以使用setTimeout(..., 100)，但它很醜，我猜 - 根本不是解決方案。

如果有一種方法可以檢測寬度穩定 - 我會在測量之後進行測量以獲得正確的值。由DOM

<div> 
    <ul> 
     <li><a href="...">1</a></li> 
     <li><a href="...">2</a></li> 
     .... 
     </ul> 
    </div> 

P.S.產生

HTML代碼爲什麼我需要這個。當<ul>嘗試變得比頁面本身更寬時，我的分頁程序的左浮動<li>項目傾向於移動到下一行。儘管大多數的<li> s爲是母公司<div>的寬度限制的隱形：

div { width: 500px; overflow: hidden; } 
div ul { width: 100%; white-space: nowrap; } 
div ul li { display: block; float: left; } 

他們還是往下走，除非我指定的<ul>與腳本的實際總結寬度。

Answer 1

我發現當我將CSS嵌入到文檔中時 - 一切正常。這證明問題是我的CSS文件還沒有被加載，儘管我使用$(document).ready()進行初始化。

當依賴外部資源並願意正確測量寬度時，應該使用$(window).load()。