我正在使用 Bootstrap 行类 col-sm-4 inside
。我需要找到具有最大高度的“标题”div
并为同一行中的每个标题设置相同的高度
。
<div class="row">
<div class="col-sm-4">
<div class="title">Blah-blah-blah</div>
</div>
<div class="col-sm-4">
<div class="title">More Blah-blah-blah</div>
</div>
<div class="col-sm-4">
<div class="title">Blah-blah-blah</div>
</div>
</div>
<div class="row">
<div class="col-sm-4">
<div class="title">Blah-blah-blah and Blah-blah-blah</div>
</div>
<div class="col-sm-4">
<div class="title">More Blah-blah-blah</div>
</div>
<div class="col-sm-4">
<div class="title">Blah-blah-blah</div>
</div>
</div>
最佳答案
$('.row').each(function()
{
var max = 0;
$(this).find('.title').each(function(){
if($(this).height() > max)
max = $(this).height();
});
$(this).find('.title').css('height', max);
});
这是最简单的方法。您可能需要调整以考虑媒体查询的断点因素,并且可能希望对选择器更加具体,以避免意外地在其他地方考虑任何因素。此外,有些人会争辩说使用 for
而不是 $.each
进行迭代,但是使用这个大小你不会注意到任何滞后。
关于javascript - 查找集合中最高的元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40985020/