追加后立即的DIV宽度计算错误？答案

【问题标题】：DIV width immediately after append is calculating wrong?追加后立即的DIV宽度计算错误？
【发布时间】：2011-02-16 14:52:30
【问题描述】：

在我正在编写的脚本中，我将反馈表单的标记附加到正文，然后使用 jQuery 在屏幕上将该元素（DIV）居中。在下面的代码示例中，form_code 包含我的表单标记。 #feedback_form 定义的 CSS 样式明确定义了宽度。但是，在追加后立即调用的 width() 计算计算错误，返回的尺寸几乎等于页面的整个宽度。

如果我用控制台提醒宽度，即使在几秒钟后，它也会正确计算。以前从来没有遇到过，有人可以解释一下吗？

jQuery('body').append(form_code);
alert(jQuery("#feedback_form").css("width"));

【问题讨论】：

标签： jquery

【解决方案1】：

您的 Javascript 代码在与呈现 HTML 的线程不同的线程中运行。如果您在添加新代码后立即查询宽度，则渲染线程将没有时间重新布局页面，因此您会获得旧的或可能是中间宽度。

我不确定较新的浏览器是否会出现这种情况，但可以肯定的是，旧浏览器会协同处理多任务，因此在您明确暂停以允许其更新之前，该页面不会更新。

如果您使用以下代码，您会发现它有效，因为零秒暂停实际上允许浏览器处理重新渲染事件。

function show_width() {
    alert(jQuery("#feedback_form").css("width"));
}
setTimeout(show_width, 0);

【讨论】：

【解决方案2】：

你想做什么？您的代码正在向 DOM 添加元素，这需要时间。添加 form_code 后，您是否尝试根据宽度等处理某些内容？

【讨论】：