Question

我试图在页面上创建多个div，它们的高度相同 - 最高div的高度。例如，如果页面上有3个包含文本的框，我希望所有框都是最高框的高度。这应该自动完成所有具有类equalheight的div。这就是我所拥有的：

jQuery(function($) {
    function equalHeight(group) {
        group.css('height','auto'); 
        var tallest = 0;
        group.each(function() {
           var thisHeight = $(this).height();
           if(thisHeight > tallest) {
              tallest = thisHeight;
           }
        });
        group.height(tallest);
    }
    equalHeight($(".equalheight"))

});

jQuery(document).ready(function($) {

     equalHeight($(".equalheight"));

});

我本可以发誓过去常常工作，但现在不行。也许有些代码在某个地方乱七八糟，我没有发现它。建议？

Answer 1

喜欢@Sushanth说...

＆＃13;

jQuery(function($) {
    function equalHeight(group) {
        //group.css('height','auto'); 
        var tallest = 0;
        group.each(function() {
           var thisHeight = $(this).height();
           if(thisHeight > tallest) {
              tallest = thisHeight;
           }
        });
        group.height(tallest);
    }
    equalHeight($(".equalheight"))

});

jQuery(document).ready(function($) {

     equalHeight($(".equalheight"));

});

＆＃13;

.red{
  background-color:red;
  width:100px;
  display:inline-block;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="equalheight red" style="height:300px">
</div>
<div class="equalheight red">
</div>
<div class="equalheight red">
</div>

＆＃13;

Answer 2

摆脱group.css('height','auto');

使用jQuery使div的高度相等

2 个答案: