找到绝对定位的子元素的高度并设置它's到其父项的高度

Find the height of absolutely positioned child element and setting it's height to its parent

本文关键字:高度 定位 元素 设置      更新时间:2023-09-26

我有一个注释列表,其中的内容位于绝对位置的div中。这是设计中所必需的。它们在一个弹出框中,设置为显示:无,然后使用单击事件淡入。

我遇到的问题是,我需要获得内部绝对内容的高度,并将该高度设置为其父内容,但似乎无法使其发挥作用。每个项目都可以是任意长度的,因为它们是注释。

我在这里做了一把小提琴来展示我的结构。http://jsfiddle.net/ZTDyA/

这就是的结构

<div class="hidden">
    <ul class="list">
        <li>
            <div class="inner">there is some content here</div>
            <div class="base">This is a div under the .inner div</div>
        </li>
        <li>
            <div class="inner">For the thing I have made this has to be positioned absolutely, but the content could be of any length so I need the parent to each of these inners to be set to the height of the inner div.</div>
            <div class="base">This is a div under the .inner div</div>
        </li>
    </ul>
</div>

当然,你可以这样做:

$('.list li').each(function() {
    $(this).height( $('.inner', this).height() );
});

jsFiddle:http://jsfiddle.net/ZTDyA/1/

我不明白的是为什么它的位置是绝对的。如果有什么不同的话,你可能想绝对定位李。也许如果你详细说明一下,我们可以提供一个更好的解决方案。像这样设置高度(通过js)是一种糟糕的做法。

检查此项:

$('button').on('click', function() {    
var hei=  $('.inner').height();
$('.inner').closest('li').height(hei); 
});