如何使用jQuery查找最高的表格单元格高度？

Question

我有一个包含不同长度文本内容的表格。我想要找到最高单元格的高度，然后使所有单元格都达到这个高度。如何实现？

- sova

Answer 1

像这样：

var max = 0;    
$('table td').each(function() {
    max = Math.max($(this).height(), max);
}).height(max);

用通俗易懂的语言描述，循环遍历所有单元格并找到最大值，然后将该值应用于所有单元格。

- Tatu Ulmanen

---

+1 是因为它很短，但你可以进行优化。例如，你可以删除 max===false ||。我认为你应该将 $(this).height() 移到一个变量中，这样可以避免多次调用函数。 - Harmen

等等，你已经修好了。我认为这是一个非常好的解决方案。 - Harmen

@Harmen，谢谢，现在使用Math.max()简化了它。 - Tatu Ulmanen

不错的解决方案，我也喜欢使用链式编程。 - John Strickler

Answer 2

只是为了与众不同：

var heights = $('td').map(function() {
    return $(this).height();
}).get();

var maxHeight = Math.max.apply(Math, heights);

$('td').css('height', maxHeight);

- John Strickler

---

你真的需要将所有表格单元格的高度保存在数组中吗？这意味着你实际上必须扫描它们三次。第一次获取所有高度，第二次迭代获取最大高度，第三次设置最大高度。 - Harmen

垃圾回收会在最后处理数组。你不认为比较每个高度需要一些CPU功率吗？Math.max.apply()非常高效。抱歉我发布了与常规不同的内容。如果你进行基准测试，它会胜出。我个人更喜欢Tatu的例子，人们可以理解链式结构。 - John Strickler

你可能是对的，我不能再取消我的踩了，下次在我按下踩的按钮之前我会先添加一条评论。 - Harmen

彬彬有礼的存在总是让我感激 Stack Overflow 提供的优质服务。 - sova

Answer 3

有几个插件可以为您完成此操作。然而，代码看起来会像这样：

var tallest = 0;
$('table td').each(function() {
  if (tallest < $(this).height()) {
    tallest = $(this).height();
  }
});

$('table td').css({'height': tallest});

- Jason McCreary

Answer 4

贡献@tatu ulmanen的示例

这很明显，但如果您只想用更高的单元格拉伸行，请使用tr循环进行包装：)

$('table tr').each(function (){
    var max = 0;
    $(this).find('td').each(function (){
        max = Math.max($(this).height(), max);
    }).height(max);
});

- Hedde van der Heide

Answer 5

您可以使用以下代码来使用jQuery。

var maxHeight = 0;
$('#yourTableID td').each(function(index, value)
{
if ($(value).height() > maxHeight)
maxHeight = $(value.height());
}).each(function(index, value) {
$(value).height() = maxHeight;
});

希望能有所帮助

- Ehsan

---

等等，这里发生了什么：$(value).height() = maxHeight。设置器需要将maxHeight作为函数参数传入，而不传参数则返回高度。那么为什么你最后不使用this呢？ - Harmen