javascript - 内容大小更改时获取更新的 div 大小

Question

我有一个包含几个内部 div 的 div。在我的 javascript/jQuery 代码中，执行一个函数，它使用 jQuery css() 函数更改内部 div 的大小。在第一个函数之后的另一个函数中，我需要读取外部 div 的大小。它的大小应该根据其内容的大小增加而增加。

所以基本上它看起来像这样：

resizeInnerDivs();
//...do something else...
doSomethingWithOuterDivSize();

输入 doSomethingWithOuterDivSize 时，IE8 和 IE9 仍会获取外部 div 的旧大小。另一方面，IE10、Firefox 和 Chrome 返回更新后的大小。

我假设 IE8 和 IE9 没有完成重新计算新大小。我试着doSomethingWithOuterDivSize();用一个setTimeout电话包装。如果我等待足够长的时间，我可以获得更好（但不一定正确）的大小值，具体取决于超时。

我可以以某种方式强制重新计算外部 div 吗？如何在 IE8 和 IE9 中也获得正确的值？

score 0 · Accepted Answer

您可能正在寻找这个：

$('.yourClass').width();
$('someElement').width();
$('#someId').width();
$('any valid jQuery/CSS selector').width();

$.width()将为您提供元素的计算宽度。

score 0 · Accepted Answer

我猜你有这两个：

您可以通过在控制台中手动查询宽度来检查这一点：

console.log($('outer_div_selector').width())

如果这返回正确的（更新的）宽度，那么您遇到了问题 #2。你可以像这样解决它：

$('outer_div_selector').width(); // this will force rendering to finish before executing the next line
doSomethingWithOuterDivSize();

否则你有一个 CSS 问题（例如，确保所有的浮动都被正确清除）。

2 回答 2