1

我的脚本在内部动态创建一个<ul>宽度左浮动<li>的 s：它是一个分页器。之后，脚本会测量所有<li>s 的宽度并将它们相加。

问题在于，在将节点注入文档后——浏览器会刷新 DOM 并应用 CSS 样式，这需要一段时间。它对我的脚本有负面影响：当这些操作在我测量宽度之前没有完成时——我的脚本得到了错误的值。如果我在一秒钟内执行测量 - 一切都很好。

我正在寻找的是一种检测<ul>完全绘制、应用样式和宽度稳定的时刻的方法。或者至少是一种检测每个维度变化的方法。我当然可以使用setTimeout(..., 100)，但它很丑，我猜——根本不是解决方案。

如果有办法检测宽度稳定性——我会在它之后立即进行测量以获得正确的值。

DOM 生成的 HTML 代码

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

PS为什么我需要这个。当试图变得比页面本身更宽时，我的分页器的左浮动<li>项目倾向于移动到下一行。<ul>即使<li>由于 parent<div>的宽度限制，大多数 s 都是不可见的：

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

<ul>除非我用脚本指定实际的总宽度，否则它们仍然会下降。

4

1 回答 1

0

我发现当我将 CSS 嵌入到文档中时——一切都很好。$(document).ready()这证明问题是尽管我用于初始化，但我的 CSS 文件尚未加载。

$(window).load()在依赖外部资源并愿意正确测量宽度时应该使用。

于 2010-06-11T14:42:48.127 回答