Question

我在很多地方使用过outerHeight和outerWidth。现在，在jQuery 1.8发布之后，我遇到了很多由对象返回而不是它的大小引起的问题。

例如：

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

我发现解决这个问题的唯一方法是在函数中使用“true / false”，如下所示，但我得到的结果与标准width()和height()函数相同：< / p>

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

有没有人知道为什么这不再有效或以其他方式获得元素的高度/宽度+其边距。

编辑：我开始相信这是因为我使用contents()函数在iframe中选择元素。我会尝试做一个演示。

Answer 1

这实际上是一个已知的jQuery错误，您可以阅读here。

我遇到没有参数的情况，修复程序正在设置参数（即使有一个默认的{false}），但我能够通过用1替换true参数并用0替换false来打破Barlas的小提琴。所以，如果你这样做，就不要这样做。

这样做：

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

不要这样做：

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

Answer 2

仅当.outerHeight(1);不.outerHeight(true);

时才有效

Answer 3

JQuery 1.8 height()，innerHeight()，outerHeight()和outerHeight(true)按预期工作：

DEMO - 工作高度方法

上面的演示使用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

Answer 4

最好的解决方法是在调用/Users/<username>/.m2/repository/com/android/support/appcompat-v7/23.0.1或true

时传递布尔参数false或outerHeight

<强>可是..

如果您无法访问调用outerWidth的文件，或者您不想编辑文件中的所有outerHeight函数，则可以覆盖jQuery {{1}像下面这样的函数使它总是传递outerHeight参数

outerHeight

Answer 5

它工作得很好，我不能确定没有看到你的html和css，但你可以检查this example并检查它在jQuery 1.8.0上工作正常

Here is working 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？

Answer 6

outerHeight仅根据jQuery DOCs返回一个整数或null。

返回元素的高度，包括顶部和底部填充，边框，以及可选的边距，以像素为单位。如果在空集上调用 elements，返回undefined（在jQuery 3.0之前为null）。

你的代码中必须有其他东西与你的输出结合，让你看到div元素。

jQuery 1.8外部高度/宽度不起作用

6 个答案: