将css属性设置为'auto'会在jquery中将高度设置为0

Question

当我尝试在jquery中将div的高度设置为auto并尝试再次计算其高度时，将得到0作为结果。为什么会这样呢？

$('#test').css('height','auto')

$('#test').height(); // 0

如何计算其高度呢？

修改

这是我正在运行的javascript代码：

function visitFix() {
    $('.visit').find('.profileDetail').each(function () {
        console.log($(this).height()); //24
        $(this).css('height', 'auto');
       console.log($(this).height()); // 0
    });
}

这就是DOM树的样子：

<td class="profileView">
    <div class="profileContent">Purpose: </div>
    <div class="profileDetail" style="height: auto;">Program Participant Volunteer Rejuvenation Participant General Visit </div>
</td>

输出为24，然后是0。

Answer 1

试试这个

http://jsfiddle.net/zS7kd/

您可以根据需要使用.height(), .innerHeight()或outerHeight()。

http://api.jquery.com/height/

.height() -返回元素的高度，不包括填充，边框和边距。

.innerHeight() -返回元素的高度，包括填充但不包括边框和边距。

.outerHeight() -返回div的高度，包括边框，但不包括边距。

.outerHeight(true) -返回div的高度，包括margin。

Answer 2

当我们进入

时

CSS

{height:auto}

HTML

<div id="test"></div>

的jQuery

 $(document).ready(function(e) {
        alert($("#test").height());
    });

然后输出 0

<div id="test">dsdsdsd</div>

现在

 $(document).ready(function(e) {
        alert($("#test").height());
    });

然后输出 20

所以当我们设置高度：自动然后自动计算高度

你希望通过填充和边距获得高度，然后有更多功能，如

参考文献：

.innerHeight() - 返回元素的高度包括填充但不包括边框和边距。

.outerHeight() - 返回包含边框的div的高度，但不包括边距。

Answer 3

我发现在某些脚本中，我设置了一个高度并需要调整大小，由于新的传入内容，您首先应首先删除任何设置高度。然后根据需要拉出outerHeight（）或innerHeight（）。