JQuery mCustomScrollbar动态高度

Question

我有一个有下拉列表的表格。这个列表是动态生成的，我使用mCustomScrollbar显示下拉列表中的元素。

mCustomScrollbar需要高度固定在px中。

<ul class=" customScroll" role="menu" aria-labelledby="dropdownMenu1" >

                                <li  >1</li>
                                <li >1</li>
                            </ul>

脚本:我尝试过初始化脚本中的各种参数，即: autoExpandScrollbar

 $(".customScroll").mCustomScrollbar();

如果有多个li元素，这些参数可以很好地工作，但是如果是2-3个li元素，则下拉列表中有一个空格，因为ul高度超过了当前元素。

任何关于动态改变元素高度的想法。

谢谢,

Answer 1

我用这种方法解决了这个问题。

首先，我增加了两个类。

.customScroll-auto{ height:auto ; overflow:hidden;}
.customScroll-fixed{ height:150px; overflow:hidden;}

然后，在jquery文件中，我检查了

if(array_length > myLimit)
     add class customScroll-fixed to the ul element
else
     add class customScroll-auto to the ul element

我不知道这是不是适合我的approach.But。

Answer 2

您可以使用以下方法计算customScroll的高度：

$(function() {
   function getChildrenHeight(element) {
      var height = 0;
      element.children().each(function() {height+= $(this).height();});
      return height;
  }

   $(".customScroll").height(getChildrenHeight($(".customScroll")));
});

您可以将函数getChildrenheight()函数与任何元素一起使用，以便根据元素对所有子元素高度的求和来获得元素的高度。