2012-08-29 14 views
8

を取得しようとしたときに、間違った値私はこのHTML構造を抱えている:jqueryの:divの高さ

<div class=container> 
    <div class=content> 
      Content goes here 
    </div> 
</div> 

私が使用してdiv.contentの高さを読んでいる:

var height = $("div.content").height(); 

は17を返します。 (私のテストケースで)

これまでのnice(ファイヤーバグを使って実際の高さと比較した場合)です。 問題は - 連続したテキストを埋めるときに> 2行間違った値になってしまいます。 実際の高さは51ですが、2行は私に34(正しい)を与えますが、3行も34を返します。もちろん、たくさんのテキストを入力すると、結果の値はすべて間違っています。 は私にjqueryのバグのようです...回避策のための任意のアイデア? おかげ

PSは:IEで完璧に動作し、Firefoxのではなく..

+0

が重複する可能性:http://stackoverflow.com/questions/11665657/how-to-calculate-elements-width-and-height-with-their-padding-margin-values-u –

答えて

30

使用$("div.content").outerHeight();間違った値を返します。

すべてのマージンを含める場合は、かっこ内に-true-を追加すると、&パディングも同様です。 $('div.content').outerHeight(true);

また、あなたは非常に良いCSSがをリセットしていない、またはレガシーブラウザ(IE6/7)を見ている場合は、クロスブラウザの高さが異なる場合がありますが、良いリセットして、その違いは非常に非常に小さいだろう。

jsFiddle Demo

+0

IちょうどそれがIEで動作することが判明しましたが、Firefoxではありません – Fuxi

+0

あなたのjsFiddleサンプルでも発生します.. – Fuxi

+1

何が起こりますか? Chrome/FirefoxとIEで同じ結果が得られます。 –