获取jquery的最终高度'；s slideToggle（）在完成执行之前-在CSS中没有固定高度

我需要在我的网站上安装一个

div B

，以便根据另一个

div a

的运行时变化高度进行动态更新

div A

使用jquery

slideToggle（）

[在

div A

]中的几个div上]，但是

div B

只能更改（同时）以匹配

div A

的当前高度<代码>面板开关1和

面板1

包含在

分区A

中：

$(document).ready(function () {
    $("#panel_toggle1").click(function () {
        $("#panel1").slideToggle("slow", function () {
            var divAheight = $("#divA").height();
            $("#divB").animate({ height: divAheight }, "slow");
        });
    });
});

上面的代码基本上满足了我的要求，但是，由于

callback（）

，它等待

slideToggle（）

完成，然后在另一个div上执行滑动效果（我被迫这样做是因为

sliteToggle（）

在完成之前不会吐出

div A

的最终

height（）

）

是否有办法使

diva

和

divb

同时平滑更新？ i、 e.是否有办法获得高度

滑动切换（）

将在其完成之前更新

div a

（这样我就可以在

div B

上与

div a

上同时调用

animate（）

）

注意：CSS中的任何div都不使用固定高度，我希望保持简单

---

或者，有没有一种方法可以让

div B

与

div a

的高度仅与CSS匹配？

如果您能够设置一个固定的divA目标高度，解决方案将很简单，您只需要将动画设置为同时运行，例如通过设置

queue=false

由于您似乎希望在不知道原始动画的最终高度的情况下同时运行这些动画，解决方法是使用两个动画来实现效果：

var $divB = $("#divB");
$divB.animate({
   height: '600px' // some arbitrary height approaching target height
}, { duration: 5000 /* longer than the next animation */, queue: false });
$("#panel1").slideToggle({
   duration: 'slow', 
   queue: false,
   complete: function () {
       var divAheight = $("#divA").height();
       // stop the animation and begin another with the correct target height
       $divB.stop().animate({ height: divAheight }, "slow");
   }
});

在这里，两个div同时开始设置动画。当slideToggle动画完成时，代码停止divB的高度动画，并开始divB=divA高度的新高度动画。有点骇客，但您必须等到第一个动画完成后才能获得更新的高度

另一个选项是执行计算以获得滑动切换结果的高度，然后同时运行动画：

var newHeight = $("#divA").height() - $("#panel1").height(); 
var $divB = $("#divB");
$divB.animate({
   height: newHeight + 'px'
}, { duration: 'slow', queue: false });
$("#panel1").slideToggle({
   duration: 'slow', 
   queue: false
});

---

如果您能够设置一个固定的divA目标高度，那么解决方案将非常简单，您只需将动画设置为同时运行，例如通过设置

queue=false

由于您似乎希望在不知道原始动画的最终高度的情况下同时运行这些动画，解决方法是使用两个动画来实现效果：

var $divB = $("#divB");
$divB.animate({
   height: '600px' // some arbitrary height approaching target height
}, { duration: 5000 /* longer than the next animation */, queue: false });
$("#panel1").slideToggle({
   duration: 'slow', 
   queue: false,
   complete: function () {
       var divAheight = $("#divA").height();
       // stop the animation and begin another with the correct target height
       $divB.stop().animate({ height: divAheight }, "slow");
   }
});

在这里，两个div同时开始设置动画。当slideToggle动画完成时，代码停止divB的高度动画，并开始divB=divA高度的新高度动画。有点骇客，但您必须等到第一个动画完成后才能获得更新的高度

另一个选项是执行计算以获得滑动切换结果的高度，然后同时运行动画：

var newHeight = $("#divA").height() - $("#panel1").height(); 
var $divB = $("#divB");
$divB.animate({
   height: newHeight + 'px'
}, { duration: 'slow', queue: false });
$("#panel1").slideToggle({
   duration: 'slow', 
   queue: false
});

---

您的第一个解决方案听起来不错，但是使用1个以上的

panel1

不容易管理。第二个解决方案有效，我使用了

-$（“#panel1”）.height（）相反，但是
diva
和
divb
在
div B
增大后会交替出现。i、 e.
panel1
关闭时
diva
缩小，但奇怪的是
divb
扩大。（我对javascript完全陌生）-我需要某种标志，以便
-$（“#panel1”）.height（）在每次单击时在
-
和
+
之间交替！您的第一个解决方案听起来不错，但是使用1个以上的
panel1
不容易管理。第二个解决方案有效，我使用了
-$（“#panel1”）.height（）相反，但是
diva
和
divb
在
div B
增大后会交替出现。i、 e.
panel1
关闭时
diva
缩小，但奇怪的是
divb
扩大。（我对javascript完全陌生）-我需要某种标志，以便
-$（“#panel1”）.height（）在每次单击时在
-
和
+
之间交替！