jQuery 设置每行的最大高度

Question

我有一个脚本可以搜索页面上的一些 div，找到最高的一个并将每个 div 设置为该高度，尽管我在尝试逐行运行此功能时遇到了困难。我试图在每行中添加一个 each 函数，但无济于事，目前每个 div 都已更改为所有 div 中最高的。

<div class="items-row">
  <div class="span4"><p>Hello</p></div>
  <div class="span4"><p>Hello</p></div>
  <div class="span4"><p>Hello</p></div>
</div>
<div class="items-row">
  <div class="span4"><p>Hello</p></div>
  <div class="span4"><p>Hello</p></div>
  <div class="span4"><p>Hello</p></div>
</div>

使用jQuery如下

$('.items-row').each(function(){
  var h = 0;    
  $('.items-row .span4').each(function(){
    if (h < $(this).height()){
      h = $(this).height();
    }
  });

  $('.items-row .span4').each(function () {
    $(this).css("height", h + 'px');
  });
});

我已经完成了 50%，如有任何帮助，我们将不胜感激。

JSFiddle

fiddle 会在单击按钮后运行，CSS 仅用于文本目的。

编辑

从仅用于测试目的的 html 中删除了未使用的分类。

Answer 1

通过在每个循环中使用 this 关键字，为您的 .span4 选择器提供一些上下文。目前，您正在将所有这些人的高度设置为总体上最高的。

$('button').click(function () {
    $('.items-row').each(function () {

        var h = 0;

        $('.span4', this).each(function () {

            if (h < $(this).height()) {
                h = $(this).height();
            }
        });

        $('.span4', this).each(function () {
            $(this).css("height", h + 'px');
        });
    });
});

JSFiddle Here .