Question

我试图让'.caption'的高度与'.post'相同。

问题是我有很多不同高度的'.post'div。

这就是我所拥有的：

$(document).ready(function (){
    var postH = $('.post').height();
    $('.caption').css( "height", postH );
});

它可以工作，但仅适用于第一个元素，其余元素保留第一个'.caption'的高度。

谢谢！

编辑：

HTML结构：

<div class="content">

    <div class="entry">
        <div class="post">...</div>
        <div class="caption">...</div>
    </div>

    <div class="entry">
        <div class="post">...</div>
        <div class="caption">...</div>
    </div>

    <div class="entry">
        <div class="post">...</div>
        <div class="caption">...</div>
    </div>

    <div class="entry">
        <div class="post">...</div>
        <div class="caption">...</div>
    </div>

</div>

更新：

我终于找到了解决方案：

$('.entry').each(function() {
    $(this).height( $(this).find('.post').height() + 80 );
});

我将'.entry'的溢出设置为隐藏。 '+ 80'是因为'.post'的填充为40。

Answer 1

如果我理解得很好，你会有很多帖子和很多标题，所以看起来应该是

$('.post').each(function() {
  $(this).closest('.caption').css('height', $(this).height());
});

这可能不适用于closest（取决于您的结构），但您已经明白了。

修改

从您的更新

使用next代替closest

$('.post').each(function() { $(this).next('.caption').height($(this).height()); });

使元素的高度等于div

1 个答案: