jQuery .height（）无法按预期工作

Question

我有一个页面，我希望彼此相邻的div具有相同的高度。

我有以下功能：

function setProjectsHeight() {
    var count = 0;
    $(".project").each(function() {
        if(count % 3 === 0) { 
            var highest = 0;
            for(i=count;i<=count+2;i++) {
                if($("div.project#"+i).height() > highest) { 
                    highest = $("div.project#"+i).height(); 
                }
            }
            console.log(highest);
        }
        count++;
    });
}

不知何故，高度始终为零。 选择器似乎是正确的（测试过），当console.log（）具有相同选择器的宽度时，它返回200（正确）。

编辑：刚刚解决了！ 不知怎的，我有了在css中设置“body {display：none}”的想法，并在document.ready（）的末尾将此属性设置回'block'。 我这样做是因为我使用了jQuery UI按钮，用户看到这些按钮从普通链接切换到UI布局。

当我删除此功能时，一切都恢复了。 看来当setProjectsHeight（）被调用时，body仍然显示：block。 因此，没有计算出的高度。

谢谢你的帮助！

Answer 1

尝试从window.load（）事件而不是document.ready（）调用该函数。

这个问题的原因是，jQuery不会启动width（）和height（）设置，直到所有img / object / ...元素都已完成加载 - ready（）会在页面处理后立即触发，但是有些对象可能仍在下载。

Answer 2

确保你有一个清除浮动的元素/应用一个clearfix（如果有任何浮动）。 如果不这样做，至少父容器不会扩展到它应该具有的高度。

还尝试使用.outerHeight()因为这包括边框大小和填充。

Answer 3

你的选择器可能是错的。 你应该只使用id选择器，因为id在文档中是唯一的并且具有最快的查找：

$('#'+i)

也正如人们所提到的那样，无法使用数字开头的id（但在大多数浏览器中都有效）

它也可能在你的DOM中有重复的id，在这种情况下，没有什么能像你期望的那样工作。 dom id必须是唯一的 。

Answer 4

你确定每个.project元素都有适当的ID属性，因为$("div.project#"+i)选择器需要ID为0,1,2等？

Answer 5

如果标签ID为1, 2, 3请在项目结束后给出空格

$("div.project #"+i)

Answer 6

刚刚解决了！ 不知怎的，我有了在css中设置“body {display：none}”的想法，并在document.ready（）的末尾将此属性设置回'block'。 我这样做是因为我使用了jQuery UI按钮，用户看到这些按钮从普通链接切换到UI布局。

当我删除此功能时，一切都恢复了。 看来当setProjectsHeight（）被调用时，body仍然显示：block。 因此，没有计算出的高度。

谢谢你的帮助！