jquery - 动态设置 en 元素的宽度以匹配相邻元素的宽度

Question

我的html如下:

<div class="row">
    <div class="image"><img src="" alt="" /></div>
    <div class="caption"></div>
</div>
<div class="row">
    <div class="image"><img src="" alt="" /></div>
    <div class="caption"></div>
</div>

我试图将每个 .caption 的宽度设置为与 .image img 的高度相同

我走在正确的轨道上吗？

$(".caption").each(function(){
    var imgheight = $(this).closest(".image img").height();
    $(this).css({
        width: imgheight
    });
});

Answer 1

试试这个，

var imgheight = $(this).closest('.row').find(".image img").height();

或

var imgheight = $(this).prev(".image").find("img").height();

您还可以使用 children()而不是 find()

closest()通过测试元素本身并向上遍历其在 DOM 树中的祖先，给出与选择器匹配的第一个元素。