私はIE Quirksモードでボックスモデルの問題を修正するために、contenteditable = trueでいくつかのDIVの高さを調整しています。jQueryで実際のCSS値を取得する方法は？
div要素のスタイルは、次のとおりです。
height: 14px;
padding: 6px;
border: 1px solid black;
overflow: hidden;
は、これまでのところ私は$("selector").css("height")を使用してCSSの高さの値を取得し、更なる計算のためにその値を使用しますが、最近では、最新のバージョンに私のjQueryライブラリを更新してきたし、このメソッドは現在壊れています。
詳細を説明します。 in jQuery 1.4.2 .css("height")は '14px'を返しますが、jQuery 1.6.2は要素とその祖先がすべて表示されている場合は '0px'を返し、それ以外の場合は '14px'を返します。
私は前者がIE Quirksmodeボックスモデル（14px高さ - 2x 6pxパディング - 2x 1pxボーダー= 0px）を使用して計算され、後者がスタイルシートから直接取得されていると推測しています。私は可視性にかかわらず元を取得したいと思います - 実際のCSS値（ "かなり"、document.styleSheets配列でそれを見ていないことを意味する）を取得するための "かなり"方法はありますか？
編集：
まず第一に、私はdiv要素の重要なスタイルプロパティを忘れてしまった：overflow: hidden（今修正）。
また、この問題は、QuirksモードでInternet Explorerでのみ発生することを強調することが重要です。私が知っている限り、それは他の（現在の）ブラウザ/モードでは問題ではありません（私はすべてをテストしていないので、100％は確信していません）。 jQueryの1.4.2
：
Element visible: true
.css('height'): 14px
.height(): 0
.outerHeight(): 14
Element visible: false
.css('height'): 14px
.height(): 0
.outerHeight(): 0
のjQuery 1.6.2：マージンは関係なく、ボックスモデルの影響を与えないよう
Element visible: true
.css('height'): 0
.height(): 0
.outerHeight(): 14
Element visible: false
.css('height'): 14px
.height(): 14
.outerHeight(): 28
.outerHeight(true)は、私には役に立ちません。要素の可視性は、$("selector").is(":visible")を使用してテストされました。
右の番号はどのように使用するのですか？私は次の計算をしなければならないボックスモデルの身長修正するには：つまり
newHeight = oldHeight + borderWidth (top & bottom) + padding (top & bottom)
を、私は14px値を必要としています。 1つは、問題の解決策が、.css('height')の値を取得しているときに要素が表示されているときに、その値を把握することであると主張することができます（現時点で私が現在行っていることです）。元の質問。実際のCSS値を取得するにはどうすればよいですか？
完全性のために、テストのマイナンバーを複製するHTML /スクリプトの例を示します（実際のテストは行っていませんが、最終結果は同じです）。IEをテスト前Quirksmode）：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="http://code.jquery.com/jquery-1.6.2.js" type="text/javascript"></script>
<style>
.input {
height: 14px;
padding: 6px 8px;
border: 1px solid black;
overflow: hidden;
}
.hidden { display: none; }
</style>
</head>
<body>
<div><div class="input" contenteditable="true">test</div></div>
<div class="hidden"><div class="input" contenteditable="true">test</div></div>
<script type="text/javascript">
$(document).ready(function(){
var t = "";
$(".input").each(function(){
t+= "visible: " + $(this).is(":visible") +"\n" +
".css('height'): " + $(this).css("height")+ "\n" +
".height(): " + $(this).height()+ "\n" +
".outerHeight(): " + $(this).outerHeight()+ "\n\n";
});
alert(t);
});
</script>
</body>
</html>
http://jsfiddle.net/pCHLB/問題はないようです。 'css（" height "）メソッドは何も計算しないことを覚えているように、対応するCSSプロパティの値を表示するだけです。 'height（）'メソッドは何らかの計算を行います。 –
trueの場合、隠されているかどうかにかかわらず同じ値が返されます。 – Woodgnome
http://jsfiddle.net/pCHLB/1/ - だから –