javascript - 在子元素高度上更改父 div 高度

Question

我有 div 页面，在那个 div 里面我有 Bootstrap 多选容器

<div class="content clearfix">
   <ul class="multiselect-container dropdown-menu">
       <li> ...</li>
   </ul>
</div>

问题是，当这个多选元素中有很多列表项时，它会隐藏在父 div 下。如何在多选容器元素高度变化时动态更改父 div 高度？

我已经尝试过

.content.clearfix {
    height:auto;
}

但这并没有帮助

Answer 1

尝试 JS 根据您的多列表元素高度动态设置高度。检查它是否可以帮助你。我只是将此代码放在 setTimeout 中，因为以防万一您的 li 元素需要时间加载到页面上。请先尝试不使用 setTimeout 功能。

$(document).ready(function(){
setTimeout(function(){
var multiselectHeight=$('.multiselect-container').height();
  $('.content').height(multiselectHeight);
  
},1000);
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="content clearfix">
   <ul class="multiselect-container dropdown-menu">
       <li> ...</li>
   </ul>
</div>