Bootstrap下拉切换是在页面滚动上添加'dropup'类

Question

通缉结果：

阻止boostrap将dropup类添加到下拉切换元素

根据您在页面上的位置（如下拉列表中的下方有“空格”），下拉列表的选项显示在实际选择的下方或上方。我查看了bootstrap文档，并且只看到了这个：

Bootstrap Dropdown

  

将下拉列表的触发器和下拉菜单包裹在.dropdown中，或者另一个声明position：relative;的元素。然后添加菜单的HTML。

然后向上：

  

通过将.dropup添加到父级，可以将下拉菜单更改为向上扩展（而不是向下）。

然而，包装器根本没有这两个类中的任何一个。因此，我将dropdown类添加到包装器中：

您可以看到页面底部的空间比顶部静止空间多。

但是，当向上滚动页面时（类dropdown添加到包装器中），bootstrap会自动添加dropup类：

我最有可能用CSS / jQ覆盖，但我不知道是否有任何我缺少的默认boostrap类或数据属性需要分配给包装器和/或下拉切换元件本身

Answer 1

2020更新，供将来的搜索者使用。为避免或阻止dropdown自动添加dropup或任何其他自动翻转类，您可以这样做。

您可以为data-flip元素添加dropdown-toggle属性，其值为false。

这是针对Bootstrap 4的，尚未尝试其他版本。

示例：

<a href='#' class='dropdown-toggle' role="button" id="dropdownMenuLink" data-toggle='dropdown' aria-haspopup='true' aria-expanded='false' data-flip='false'>BUTTON</a>

Answer 2

在进行一些研究后，所有ChatUser.class元素都在使用select，并强制这些selectpicker()元素始终＆＃34;下拉＆＃34;，需要以下内容：

select

Answer 3

对不起，我迟到了@Rob。是的，selectpicker（）是Bootstrap-Select

的一部分

如果您对此不熟悉，请查看。它具有许多Bootstrap中缺少的功能。

注意：如果您看到班级＆＃39; selectpicker＆＃39;你正在处理Bootstrap-Select