2个表，需要为每个匹配的行设置具有最大高度的行(2 tables, need to set the rows with the maximum height for each matching row

2个表，需要为每个匹配的行设置具有最大高度的行(2 tables, need to set the rows with the maximum height for each matching row)

我有2个html表，我需要每行具有相同的高度。

因此，如果表＃1的第3行的高度为25，那么表＃2的第3行的高度应为25。

无论哪个匹配行具有最大高度，则两个行应具有相同的高度。

我怎样才能做到这一点？

我知道如何遍历行如：

$("table1 tr").each(function() { }); $("table2 tr").each(function() { });

I have 2 html tables, I need to have each row with the same height.

So if table#1's 3rd row has a height of 25, then table#2's 3rd row should have a height of 25.

Whichever matching row has the largest height, then both rows should have the same height.

How can I do this?

I know how to traverse the rows like:

$("table1 tr").each(function() { }); $("table2 tr").each(function() { });

最满意答案

你可以这样做（假设两个表有相同的行数）：

//for each row in table one $("#table1 tr").each(function(index, element){ //get row height from table1 and the corresponding row in table two var rowOneHeight = $(this).height(); var rowTwo = $("#table2 tr:eq(" + index + ")"); //if no matching row was found in table two, stop loop if(!rowTwo.length) return false; var rowTwoHeight = rowTwo.height(); //compare row heights, and set the least high row to the height of the highest one if(rowOneHeight > rowTwoHeight){ //set rowTwoHeight to rowOneHeight rowTwo.height(rowOneHeight); }else{ $(this).height(rowTwoHeight); } });

You can do something like this (assuming both tables have an equal amount of rows):

//for each row in table one $("#table1 tr").each(function(index, element){ //get row height from table1 and the corresponding row in table two var rowOneHeight = $(this).height(); var rowTwo = $("#table2 tr:eq(" + index + ")"); //if no matching row was found in table two, stop loop if(!rowTwo.length) return false; var rowTwoHeight = rowTwo.height(); //compare row heights, and set the least high row to the height of the highest one if(rowOneHeight > rowTwoHeight){ //set rowTwoHeight to rowOneHeight rowTwo.height(rowOneHeight); }else{ $(this).height(rowTwoHeight); } });