Question

我有一个 div 包含文本的 div 文本, 仅在特定情况下显示在另一个 div 中。 HTML 简单, 看起来像 :

<div id= parent >
  <div id= child >
    Some text inside child div
  </div>
</div>

外形看起来像:

#parent{ display:none; height:0px; }

利用jQuery,我想得到孩子的身高,就像我一样,如果div是在父母外。

下面的喷射针返回0, 我希望大约15点左右。

var child_height = $( #child ).height();
alert(child_height);

Answer 1

尝试所有这些只是工作顺利:

console.log($( #child ).outerHeight());

console.log($( #child ).css( height ));

console.log($( #child ).height());

根据您编辑的 :

var height = $( #parent ).css({visibility:  hidden , display :  block }).find( #child ).height();

$( #parent ).css({visibility:  hidden , display:  none });

console.log(height);

http://jsfidd.net/zjpav/6/" rel=“不跟随” >DEMO

Answer 2

你可以暂时给隐藏的父母看然后隐藏在:

// .parents means it will search through all parents, not just first hidden
var hiddenParents = $("#child").parents(":hidden").show();
var childHeight = $("#child").height();
hiddenParents.hide();

alert(childHeight);

http://jsfiddle.net/zjpav/3/" rel="no follow" >http://jsfiddle.net/zjpav/3/

Answer 3

我注意到你说:“只有在特定情况下才能显示另一个 div ” 。如果父 div 有 < code> display: nor; (例如,如果你使用多个 jQuery 函数中的任何函数隐藏它, 则它最终会变成这样), 那么孩子的高度将返回为 0 。

Answer 4

var child_height = $( #child ).outerHeight();
alert(child_height);

"http://jsfiddle.net/mprabhat/kj8mg/1/" rel="nofollow" >Demo

虽然在FF 10上你的原代码工作正常。

按注释更新 :

对于隐藏字段,它会返回零, 您可以做类似的事情 :

jQuery( #parent ).css( display , block );
var child_height = $( #child ).outerHeight();
alert(child_height);

child_height = $( #child ).height();
alert(child_height);
jQuery( #parent ).css( display , none );

""http://jsfiddle.net/mprabhat/kj8mg/2/" rel="no follow" >Demo

友情链接