jQuery/Javascript-将div height设置为该行中的最大元素高度

我有一行包含4种产品，就像下面的示例一样（在示例中，我只包含1种产品，只需在

中重复

3次即可）：

我的页面有多个

元素。是否可以让上面的函数为每一行运行？我希望每一行都能独立行动。例如，我不希望第6行中的产品影响第2行。

尝试下面的JS代码：

$('.row').each(function(){
  boxes = $(this).find('.matchHeight');
  maxHeight = Math.max.apply(
  Math, boxes.map(function() {
    return $(this).height();
  }).get());
  boxes.height(maxHeight);
});

---

在这里添加答案代码，但进行了更新，使其更整洁、更高效。我的团队中有人试图使用它，因为它在代码笔中，我必须清理它以进行生产，因此只需节省未来用户的麻烦：

JS:

var equalheight=函数（容器）{
var elems=$（container.children（）；
if（元素长度）{
var=0，
当前行，
一行
每个元素（函数（）{
var$el=$（本）；
var topPosition=$el.position（）.top；
$el.高度（“自动”）；
如果（currentRow！=topPosition）{
//如果我们已经运行了任何元素，请设置它们的高度
行和行长度和行高度（当前最高）；
//重置当前行、最高高度并从“行”中删除所有元素
row=$el，currentRow=topPosition，currentHighter=$el.height（）；
}否则{
//如果我们仍然在同一行上，请将此元素添加到该行并测试其高度
行=行。添加（$el）；
当前最高=当前最高<$el.height（）？$el.height（）：当前最高；
}
//如果有多个元素，请设置高度，否则它将已经是正确的高度
如果（行长度>1）{
行高（当前最高）；
}
});
}
};
等高（$（'.等高'））

Html:

在每一行

上循环，并在其中找到
.matchHeight
元素，并将
maxHeight
积分设置为=>responsive version，该版本工作正常！谢谢
boxes = $('.matchHeight');
maxHeight = Math.max.apply(
Math, boxes.map(function() {
    return $(this).height();
}).get());
boxes.height(maxHeight);

$('.row').each(function(){
  boxes = $(this).find('.matchHeight');
  maxHeight = Math.max.apply(
  Math, boxes.map(function() {
    return $(this).height();
  }).get());
  boxes.height(maxHeight);
});

var equalheight = function (container) {
    var elems = $(container).children();
    if (elems.length) {
        var currentTallest = 0,
            currentRow,
            row;

        elems.each(function () {
            var $el = $(this);
            var topPosition = $el.position().top;
            $el.height('auto');

            if (currentRow != topPosition) {
                //if we ran any elements already, set their height
                row && row.length && row.height(currentTallest);

                //reset the current row, tallest height and remove all elements from 'row'
                row = $el, currentRow = topPosition, currentTallest = $el.height();
            } else {
                //if we are still on the same row, add this element to the row and test its height
                row = row.add($el);
                currentTallest = currentTallest < $el.height() ? $el.height() : currentTallest;
            }
            //set the height if we have more than 1 element, otherwise it will already be the correct height
            if (row.length > 1) {
                row.height(currentTallest);
            }
        });
    }
};

equalheight($('.equal-height'))

<div class="equal-height">
    <div class="child-to-resize-1"></div>
    <div class="child-to-resize-2"></div>
    <div class="child-to-resize-3"></div>
</div>