如何调整selectpicker下拉菜单的高度

By simon at 2018-02-28 • 0人收藏 • 206人看过

我有一个selectpicker(引导)在我的页面正在加载的选项 动态。它有大量的名单,但不是很好的你看。我要 减少selectpicker的高度。我已经给内联风格和所有,但它 没有反映。 这是我的合作伙伴该

<select class="selectpicker" data-dropup-auto="false" id="estType" name="estType">
   <option selected disabled value="0">Select</option>'
</select>
我的js代码
$function ({
    $.ajax({
        datatype: "json",
        type: "GET",
        async: false,
        url: "Establishment/GetPrePopulationDetails",
        success: function (result, success) {
            var esttypes = $.map(result['EstablishmentTypes'],
                function (key, value) {
                    return $('<option>', { value: value, text: key });
                });
            $('#estType').append(esttypes);
        },
        error: function (xhr, ajaxOptions, thrownError) {
            console.error(xhr.status);
            console.error(thrownError);
        }
    });
});

4 个回复 | 最后更新于 2018-02-28
2018-02-28   #1

我自己纠正了它... 只需在html中添加data-size即可

<select class="selectpicker" data-dropup-auto="false" data-size="5" id="estType" name="estType">
   <option selected disabled value="0">Select</option>'
</select>

2018-02-28   #2

虽然也许不是你想要的,但它是一个很好的选择。 https://silviomoreto.github.io/bootstrap-select/examples/#lIVE搜索 它允许在下拉菜单中进行搜索,因此不需要 调整下拉的高度,加上它适用于引导。

2018-02-28   #3

我自己纠正了它... 只需在html中添加data-size即可

<select class="selectpicker" data-dropup-auto="false" data-size="5" id="estType" name="estType">
   <option selected disabled value="0">Select</option>'
</select>

2018-02-28   #4

使用[Bootstrap Select](https://silviomoreto.github.io/bootstrap-select/), data-size不适用于我。我需要重写用这个CSS:

div.dropdown-menu.open{
  max-height: 314px !important;
  overflow: hidden;
}
ul.dropdown-menu.inner{
  max-height: 260px !important;
  overflow-y: auto;
}
根据需要更改尺寸。

登录后方可回帖

Loading...