我已经使用outerHeight
和outerWidth
上许多地方。 现在,jQuery的1.8发布后我遇到了很多的造成对象的回报,而不是它的大小问题。
例如:
$('#stackoverflowdiv').Height() // returns 100 px
$('#stackoverflowdiv').outerHeight() // returns "stackoverflowdiv" div
我已经找到了解决这个问题的唯一的事情就是,但我得到相同的结果为标准的功能使用“真/假”,如下所示width()
和height()
函数:
$('#stackoverflowdiv').outerHeight(true) // returns 100 px
$('#stackoverflowdiv').outerHeight(false) // returns 100 px
有没有人知道这是为什么不工作更多的或其他方式来获得元素+利润率的高度/宽度。
编辑:我开始认为,这是造成的,因为我选择使用iframe元素contents()
函数。 我会尽力做一个演示。
这实际上是一个已知的jQuery的错误 ,你可以读到这里 。
我没有经历参数,它与修复程序设置参数(即使有一个默认的{FALSE}),但我能打破巴尔拉斯用1代替真实参数小提琴和以0虚假所以不要”做T,如果你是。
做这个:
alert(jQuery(this).outerHeight(false));
不这样做:
alert(jQuery(this).outerHeight());
alert(jQuery(this).outerHeight(0));
它只是如果我做工作.outerHeight(1);
不.outerHeight(true);
最好的解决方法是通过布尔参数true
或false
时调用outerHeight
或outerWidth
但..
万一你没有访问文件这就要求outerHeight
,或者您不希望编辑所有outerHeight
在文件中的功能,你可以重写jQuery的outerHeight
功能类似下面使其始终传递true
参数
var oldOuterHeight = $.fn.outerHeight;
$.fn.outerHeight = function () {
return oldOuterHeight.apply(this, [true]);
};
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
它做工精细队友,我不能没有看到你的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
?
outerHeight
仅返回一个整数或null
根据jQuery的的DOC 。
返回元件,包括顶部和底部填充,边框和任选余量,以像素为单位的高度。 如果在一个空元素集合中调用,返回undefined(空的jQuery 3.0之前)。
必须有别的东西在你的代码和您的输出把玩,让你看到的div元素。