Question

我有一些div，他们有不同的大小，所以我想等于所有dis的高度。

问题是如果我刷新页面之后，下面的代码工作正常页面加载。

我应该怎么做才能将div的高度设置为所有div的最高处？

$(function() {
    var maxHeight = Math.max.apply(null, $("div.product").map(function() {
        return $(this).height();
    }).get());
    $("div.product").css("height", maxHeight);
});

Answer 1

您可以创建新的样式规则并将其附加到主题部分：

$(function(){
var maxHeight = Math.max.apply(null, $("div.product").map(function(){
                                            return $(this).height();
                                    }).get());
$("<style type='text/css'> .product{ height:"+ maxHeight +";} </style>").appendTo("head");
});

Answer 2

为什么使用JavaScript来实现这一目标只能用CSS实现？

将产品div包含在一个新元素中，该元素的显示设置为flex，因此所有子元素都将延伸到该父元素。

.parent { 
display: flex;
display: -webkit-flex;
}

Answer 3

这是你的答案

DATE
2015-10-10 00:00:00      0.000000
2015-10-10 01:00:00    145.000000
2015-10-10 02:00:00    171.666667
2015-10-10 03:00:00    128.750000
2015-10-10 04:00:00    103.000000
Name: average, dtype: bool

编辑：代码缩进。

我应该怎么做才能将div的高度设置为所有div的最高处

3 个答案: