2

我正在使用$.each最新版本的 jQuery 来计算由类名选择的 DOM 元素集合的高度,

$.each($('.some-class'), function() {
  console.log($(this).height());
}

我得到一个高度值列表,这些值似乎都关闭并且高于它们应有的值,640、657、334、487。

但是,当我进入控制台并计算第一个高度时$('.some-class').first().height(),我得到553的是准确的。

$.each 发生了什么?当$(this)我用console.log($(this)).

4

2 回答 2

2

所以我回答了我自己的问题。我在文档完成加载块之后执行代码$(document).ready(function(){...}),这意味着在文档完成加载之后计算高度,但页面完全加载并且我的$(document).ready块中的所有其他代码完成加载之前。

当我在窗口完成加载后计算高度时,在

$(window).load(function(){...})

块,我能够得到正确的高度值。

我也没有提到我在开发模式下使用 Ruby on Rails,因此资产(CSS 等)在运行时被编译。我的怀疑是,考虑到 Rails 资产管道,我的 CSS 样式在 HTML 文档被加载并且我的$(document).ready()块被触发时没有被加载,所以我的样式可能还没有在文档准备好和我的窗口已完成加载,这会影响我的 DOM 元素的高度。

在块中加载完窗口后计算 DOM 高度$(window).load允许我确保在计算高度之前已经应用了我的 CSS 样式。

认为这是一个直接的 jQuery 问题。原来是一个潜在的 Rails 问题。

谢谢大家!

于 2013-09-18T19:35:37.740 回答
0

.height()总是返回内容高度,它不会关心 css box-sizing 属性。如果您有或没有box-sizing:border-box,则不包括填充和边距。

您可以使用.css( "height" )而不是.height()

于 2013-09-18T19:28:07.933 回答