jQuery height() 在可见 div 上返回 0 - 为什么？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9292529/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery height() returns 0 on a visible div - why?
提问by TomBaine
I have a container (thetext1) with a set height of 360px. "thetext1" contains two divs - one on the left and one floated to the right - into both of which content is delivered through an ajax call.
我有一个设置高度为 360px 的容器 (thetext1)。“thetext1”包含两个 div - 一个在左侧，一个浮动到右侧 - 内容通过 ajax 调用传递到这两个中。
There will be times when the content in one or other of these divs exceeds 360px and so I want to increase the height of thetext1 accordingly.
有时这些 div 中的一个或另一个中的内容会超过 360px，因此我想相应地增加 thetext1 的高度。
My test code
我的测试代码
newhgt = $('#thetext1').find('div.rhs').css("background", "pink").height();
returns 0 - (my selector is correct as the targeted div is perfectly pink!).
返回 0 - （我的选择器是正确的，因为目标 div 是完美的粉红色！）。
Why is this? I know - from answers to previous posts on this site - that the solution is to add overflow: hidden thetext1, but I would like to understand why my attempt to get the height of the rhs and lhs div is failing.
为什么是这样？我知道 - 从本网站上以前帖子的答案 - 解决方案是添加溢出：隐藏 thetext1，但我想了解为什么我尝试获取 rhs 和 lhs div 的高度失败。
回答by Gazzer
Make sure the code is inside the $(window).load [not $(document).ready ]
确保代码在 $(window).load [not $(document).ready ] 内
$(window).load(function () {
newhgt = $('#thetext1').find('div.rhs').css("background", "pink").height();
});
回答by Daniel
I had the same problem, and I noticed one thing, the div needs to be visible when you call .height();
我有同样的问题，我注意到一件事，当你调用 .height(); 时，div 需要可见；
But, even if the div is visible, the parents of this div needs to be visible.So you must garantee that parents div are visible (display != none)
但是，即使 div 可见，该 div 的父级也需要可见。因此，您必须保证父 div 可见（显示！= 无）
writing a $('#div').parent().show();will make a parent visible, you may need anothers parent().show();
写 a$('#div').parent().show();将使父母可见，您可能需要其他人parent().show();
回答by acarito
You can still use $(document).ready as long as you check to see if the element is loaded first. I chose to go with
您仍然可以使用 $(document).ready 只要您检查元素是否首先加载。我选择和
$("_element name/id_").load(function() {
$(this).height();
});
I originally found the solution here: http://www.fortwaynewebdevelopment.com/jquery-width-or-height-always-returns-0-fix/
我最初在这里找到了解决方案：http: //www.fortwaynewebdevelopment.com/jquery-width-or-height-always-returns-0-fix/
And chose to use the answer in the first response.
并选择使用第一个响应中的答案。
回答by Sajjad Shirazy
newhgt = $('#thetext1').find('div.rhs').css("background", "pink")[0].getBoundingClientRect().height;
回答by ariferol01
I solved my problem like this:
我这样解决了我的问题：
setInterval(function(){
alert($("#element").height());
}, 1000);
It works for me.
这个对我有用。
