Bootstrap-Select 打开 div 下的选项

Question

我有一个固定大小的 div。假设50px。在里面我有一个下拉菜单。我使用 bootstrap select 使其可搜索。

<div style="height=40px;width:200%; overflow-x:scroll;" id="hugewidth">
  <select id="ss">
    <option>1</option>
    <option>1</option>
    <option>1</option>
    <option>1</option>
    <option>1</option>
  </select>
  <br/><br/><br/>
</div>

现在的问题是当我打开下拉菜单时，选项位于 hugewidth div 下。我希望下拉菜单在该 div 上方打开。请参阅可能解决问题的 JSFiddle。

JSFiddle

看！！它位于滚动条下方。谁能帮我解决这个问题？？ 我希望下拉选项 div 越过滚动条。如果不可能，那么有没有办法在打开和关闭时根据下拉选项大小调整 div 高度？ 下拉选项是动态的。

还有一件事。是否可以阻止下拉菜单向上打开？示例：JSFiddle

Answer 1

您可以添加：

data-container="body"

选择元素。或者另一个元素在那里显示下拉菜单。看见： http://jsfiddle.net/IceManSpy/Y9hyD/2/

文档中的演示：https://developer.snapappointments.com/bootstrap-select/examples/#container