Question

每个图片容器（图）需要采用其中包含的图片（img）的宽度并放置一个（figcaption）宽度与容器相同。

如果我只使用一个容器，那么当我使用多个数字时，它会将每个数字设置为第一个图像的大小。

所以我在foreach循环中犯了一个逻辑错误，但无法找到解决方案。有帮助吗？我在jQuery中很新。

<figure><img><figcaption></figcaption></figure>
<figure><img><figcaption></figcaption></figure>
<figure><img><figcaption></figcaption></figure>

<script>  
$(document).ready(function(){
    //make figure the width of its image child
    $('figure').each(function() {
    var childWidth = $('figure img').width();
    console.log(childWidth);
    $('figure').width(childWidth);
    })
});
<script>

look at the html/css code

Answer 1

您正在figure中选择并设置所有width元素.each()。替代

var childWidth = $("img", this).width(); // selects current `figure` `img`

代表

var childWidth = $('figure img').width(); // selects all `img` elements

和

$(this).width(childWidth); // selects current `figure`

代表

$('figure').width(childWidth); // selects all `figure` elements

jQuery：为每个<figure>父级提供与其<img/>子级相同的宽度

1 个答案: