获得一个div大小，以便在负载后调整另一个div大小。

Question

我有一个包含其他div的div，我需要动态地刷新这类父div。为此，im使用jquery加载带有args的php文件。

这个php文件在第一个文件中创建了另外两个div。

第一个包含相同大小的项目，在通常的屏幕上基本上是600 on。

第二个可以包含非常长的文本，我想相应地调整它的大小到第一个div高度在大屏幕上，两个div是并排的。

父div：<div id="modStart" class="row mt-5 pt-3">

第一个动态div：

<div id = "modC" class="col-xl-5 col-lg-12 mb-4">
  <div class="tm-bg-gray p-5 h-100">
    <?php
      //embed a video,a title and a button. Almost constant height but still depending on title length.
    ?>                              
  </div>                                
</div>                              

第二个动态div (需要调整大小)：

<div id = "modbC" class="col-xl-6 col-lg-12 mb-4">
  <div id = "modb2C" class="tm-bg-white p-5 h-100" style="overflow-y: scroll;">
    <?php
      // very long dynamic text
    ?>
  </div>
</div>

和我调用的js函数来刷新父div

    function refreshMod(nMod)
    {
        $("#modStart").load("form_CSifr.php?currMod=" + nMod.toString(),function() 
        {
                var offsetHeight = document.getElementById("modC").offsetHeight;
                
                //DBG
                alert(offsetHeight.toString()); 
                // always the height of the very long content of the second div ...
                // so i guess it's too late here. 
                // I tried this code before filling the second div content but same rsult.

                document.getElementById("modbC").style.height = offsetHeight + "px";
                document.getElementById("modb2C").style.height = offsetHeight + "px";
        }); 
    }

我试着找出不同物品的大小和大小。但我现在被困住了。别再想了。

我对引导很陌生，所有这些div都包含在

<div class="container-fluid">
   <div id="content" class="mx-auto tm-content-container">

也许我不能在这里这么做。

最后一件事是，在我把代码放进另一个php文件之前，它就可以工作了，只重新加载这个div。

感谢您的阅读。

Answer 1

由于您使用的是jQuery，所以只需使用没有任何参数的方法height()来获得第一个div高度并将其应用到另一个div，同样使用height()方法--这次使用的是参数：

​

const leftDivHeight = $('#modC').height();
$('#modbC').height(leftDivHeight);

​