首页 > 解决方案 > 动态下拉。切换仅在第一个下拉菜单中显示

问题描述

我将下拉菜单插入到动态表单中。问题是当我插入多个下拉菜单时。

当我单击任何下拉按钮时,切换列表仅显示在第一个下拉按钮上方,而不是我单击的下拉按钮上方。

所以说我在表单中插入了 3 个下拉按钮。如果我单击下拉 2 或 3;内容列表显示在下拉列表 1 上方。

这是我要插入表单的代码。

let vendor = `<div class="dropdown">
  <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
    Dropdown
    <span class="caret"></span>
  </button>
  <ul class="dropdown-menu test" id="vendor['+nextindex+']" name="vendor['+nextindex+']" aria-labelledby="dropdownMenu1">
    <li><a href="#" data-value="action">Action</a></li>
    <li><a href="#" data-value="another action">Another action</a></li>
    <li><a href="#" data-value="something else here">Something else here</a></li>
  </ul>
</div>`

标签: javascripthtmlbootstrap-4

解决方案


我能够找到解决方案。 Bootstrap 4 Dropdown - 禁用由 popper.js 引起的自动放置

这是 popper.js 的一个问题。


推荐阅读