2016-04-01 49 views
0

當CSS高度設置爲Auto時,如何獲得充滿文本的div對象的完整高度?當高度爲自動時,jQuery OuterHeight/Height會返回錯誤的高度值

我試過OuterHeight,它仍然不是div對象的完整高度。

的jsfiddle:https://jsfiddle.net/zerolfc/jg8s5oq3/3/

的jQuery:

$('div').find('*').each(function(ti,tv){ 
var c = parseInt($(tv).css('font-size'))/2; 
c = Math.floor(c); 
c = (c < 8 ? 8 : c); 
$(tv).css('font-size', c + 'px'); 
}); 

console.log($('div').outerHeight(true)); 

CSS:

div { display: block; width: 640px; height: auto; } 
p { font-size: 24px; } 

HTML:

<div> 
<p>This is a textbox that you can add text to suit your design and alter.This is a textbox that you can add text to suit your design and alter.</p> 
<p>This is a textbox that you can add text to suit your design and alter.This is a textbox that you can add text to suit your design and alter.</p> 
<p>This is a textbox that you can add text to suit your design and alter.This is a textbox that you can add text to suit your design and alter.</p> 
<p>This is a textbox that you can add text to suit your design and alter.This is a textbox that you can add text to suit your design and alter.</p><p>This is a textbox that you can add text to suit your design and alter.This is a textbox that you can add text to suit your design and alter.</p><p>This is a textbox that you can add text to suit your design and alter.This is a textbox that you can add text to suit your design and alter.</p> 
</div> 
+0

返回撥弄我的正確值。 – Goombah

+0

http://imgur.com/a/AXATT – Goombah

+0

在控制檯窗口中,我得到了與你相同的228像素,但是在檢測div時爲252像素,它在Chrome中返回252像素的高度(尺寸工具提示)? – tonoslfx

回答

1

收益權在搗鼓我的價值觀。

http://api.jquery.com/outerheight/

$('div').outerHeight(true) = [height of the $('div') + margin of $('div')] 

但你$('div')元素可是沒有任何保證金,按您目前的CSS規則。

這意味着, $('div').outerHeight(true)將返回$('div')的實際高度沒有任何餘量。

在您的情況下,以下所有3的值將會相同。

  • $('div').outerHeight(true)
  • $('div').outerHeight()
  • $('div').css('height')