JQuery - 如何动态设置一个 div 的高度等于另一个

Question

我有两个 div，.box-1 和 .box-2。

我想将两者的高度设置为等于具有较大高度的那个。

谁能告诉我为什么这段代码不起作用？

var $box1Height = $('.box-1').height();
var $box2Height = $('.box-2').height();

if ($box2Height > $box1Height) {
    ($box1Height).height($box2Height)
} else {
    ($box2Height).height($box1Height)
}

Answer 1

要更新的元素是 $(".box-1") 和 $(".box-2")。您没有更新它们，而是获取了它们的高度值，并尝试更新它们的高度值的高度值(类似这样的东西:$(".box-1").height().height(new_value);，这显然不存在。比较很好，但更新不是针对正确的元素。

您可以只使用元素 $('.box-1') 而不是使用 $('.box-1').height();并使用它。

像这样:

var box1 = $('.box-1');
var box2 = $('.box-2');

现在我们有了元素本身，让我们来处理它的属性。要获取元素的高度 - 使用:

box1.height();

要为此 height 属性设置新值，请使用:

box1.height(new_value);

放在一起:

var box1 = $('.box-1');
var box2 = $('.box-2');
if (box1.height() > box2.height()) {
    box1.height(box2.height())
} else {
    box2.height(box1.height())
}