0

我有一个包含很多行和列的 html 结构。现在我希望同一行中的所有列都具有相同的高度。

我制作了一个执行equalHeight的脚本。但是这个脚本在所有列上都设置了相同的高度。您可以在下面找到 html 和脚本。

我做错了什么?感谢你们对我的帮助!

<div class="row">
    <div class="column">

    </div><!-- /column -->
    <div class="column">

    </div><!-- /column -->
</div><!-- /row -->
<div class="row">
    <div class="column">

    </div><!-- /column -->
    <div class="column">

    </div><!-- /column -->
    <div class="column">

    </div><!-- /column -->
</div><!-- /row -->

function equalHeight(group) {
   tallest = 0;
   group.each(function() {
      thisHeight = $(this).outerHeight();
      if(thisHeight > tallest) {
         tallest = thisHeight;
      }
   });
   group.height(tallest);
};

equalHeight($('.row .column'));
4

1 回答 1

1

拿这个脚本http://jsfiddle.net/mmSeU/2/

function equalHeight(group) {
$(group).each(function(i,eachrow) {
       tallest = 0;
                      $(eachrow).children('.column').each(function(j,eachcolumn) {
          thisHeight = $(eachcolumn).outerHeight();
          if(thisHeight > tallest) {
             tallest = thisHeight;
          }
       });
       $(eachrow).children('.column').height(tallest);
    });};equalHeight($('.row'));
于 2013-10-30T11:43:02.350 回答