jquery – 如何为每个容器div中的每组子div设置高度？

我有许多带有子div的容器(class =“sideBox”),每个div都有不同的内容.

在某些情况下,我希望子div为每个父div的100％高度,有时添加垂直分隔符样式.

为此,我将一个cfull类添加到子divs和vcon到容器中,类为’sideBox’.

然后调用jquery函数：

var y = $('.cfull').parent('div.vcon').height();
    $(".cfull").height(y) ;

当只有一个实例并将其子项div高度设置为侧箱的高度时,这非常完美.

如果我在html中添加第二个sideBox vcon,并给其中一个孩子divs额外的内容.第二个sideBox子div获取从sideBox的第一个实例设置的高度

如何在class =“sideBox vcon”容器div中设置每组子div的高度？

我希望这是有道理的.

这是我到目前为止的工作示例,您将看到第二个侧箱子的第一个侧箱中的样式=“height：#px”

http://bit.ly/jqueryheightissue

最佳答案

你正在做的是被称为隐式迭代.当你这样做：

$('.cfull').height(y);

…你正在做的是将所有.cfull元素设置为只有一个高度值(y的当前值).

您希望显式迭代每个元素,可能使用.each().

$('.cfull').each(function () {

    var self = $(this),container = self.parent('div.vcon');

    self.height(container.height());

});

但是,您应该能够使用纯CSS完成您想要实现的目标.你有没有试过这样的事情？

.cfull {
    height : 100%;
}