29

私は多くの場所でouterHeightandを使用しました。outerWidthさて、jQuery 1.8 がリリースされた後、サイズではなくオブジェクトの戻りによって引き起こされる多くの問題に遭遇しました。

例えば：

$('#stackoverflowdiv').Height()      // returns 100 px
$('#stackoverflowdiv').outerHeight() // returns "stackoverflowdiv" div

width()これを修正するために私が見つけた唯一のことは、次のように関数で「true/false」を使用することでしたが、標準およびheight()関数と同じ結果が得られます。

$('#stackoverflowdiv').outerHeight(true)  //  returns 100 px
$('#stackoverflowdiv').outerHeight(false) //  returns 100 px

要素の高さ/幅+そのマージンを取得するために、これが機能しなくなった理由や他の方法を知っている人はいますか?

contents()編集:関数を使用してiframeの要素を選択しているため、これが原因であると信じ始めました。デモを作ってみます。

4

6 に答える 6

35

これは実際には既知の jQuery バグであり、ここで読むことができます。

パラメータなしでそれを経験しており、修正はパラメータを設定しています（デフォルトの{false}がありますが）が、trueパラメータを1に、falseパラメータを0に置き換えることでBarlasのフィドルを壊すことができました。あなたがそうなら、それをしないでください。

これを行う：

alert(jQuery(this).outerHeight(false));

これをしないでください：

alert(jQuery(this).outerHeight());
alert(jQuery(this).outerHeight(0));
于 2013-03-25T03:56:37.287 に答える
5

.outerHeight(1);私がしない場合にのみ機能します.outerHeight(true);

于 2013-06-06T14:50:38.403 に答える
2

JQuery 1.8 height()、innerHeight()、outerHeight()およびouterHeight(true)は期待どおりに動作します。

デモ- 作業高さの方法

上記のデモでは、div を使用しています。

<div id="myDiv">My Div</div>

次の CSS を使用します。

div{
    border: 1px solid blue;
    padding: 5px;
    margin: 10px;
}

このスクリプトの使用:

var $div = $("#myDiv");
var height = $div.height();
var heightWithPadding = $div.innerHeight();
var heightWithPaddingAndBorder = $div.outerHeight();
var heightWithPaddingAndBorderAndMargin = $div.outerHeight(true);

var $result = $("#result");
$result.append("height: " + height);
$result.append("<br />height with padding: " + heightWithPadding);
$result.append("<br />height with padding and borders: " + heightWithPaddingAndBorder);
$result.append("<br />height with padding and borders and margin: " + heightWithPaddingAndBorderAndMargin);

その結果、次のようになります。

height: 20
height with padding: 30
height with padding and borders: 32
height with padding and borders and margin: 52
于 2012-08-23T14:28:46.640 に答える
2

最善の解決策は、ブール値パラメーターを渡すか、trueまたはfalse呼び出し時にouterHeightouterWidth

しかし..

呼び出し元のファイルにアクセスできない場合や、ファイル内のすべての関数outerHeightを編集したくない場合は、次のように jQuery 関数をオーバーライドして、常にパラメーターを渡すようにすることができます。outerHeightouterHeighttrue

var oldOuterHeight =  $.fn.outerHeight;

$.fn.outerHeight = function () { 
    return oldOuterHeight.apply(this, [true]);
};
于 2015-10-08T18:08:58.900 に答える
1

それは正常に動作しています.htmlとcssを見ないとわかりませんが、この例を調べて、jQuery 1.8.0で正常に動作していることを調べることができます

ここではjsFiddleが動作しています。

jQuery:

console.log($('#stackoverflowdiv').outerHeight(false));//returns 110
console.log($('#stackoverflowdiv').outerHeight(true));//returns 130

CSS:

#stackoverflowdiv { 
      height:100px; 
      margin:10px 5px; 
      padding:5px; 
      border 2px solid #fff;
}​

セミコロンまたは定義の使用を忘れていませんdocument.readyか? またはさらに悪いことに、またはを定義するのを忘れていましたmarginかborder？

于 2012-08-23T14:29:28.153 に答える
-2

outerHeight整数のみを返すか、 jQuery DOCnullに従って返します。

要素の高さ (上下のパディング、境界線、オプションで余白を含む) をピクセル単位で返します。要素の空のセットで呼び出された場合、undefined を返します (jQuery 3.0 より前では null)。

コードには、出力を処理して div 要素を表示する何かが必要です。

于 2012-08-23T14:28:24.917 に答える