Bootstrap Popover 忽略放置选项

Posted 2023-05-08

【中文标题】Bootstrap Popover 忽略放置选项

【英文标题】：Bootstrap Popover Ignoring Placement Option

【发布时间】：2021-02-12 09:57:12

【问题描述】：

我在引导模式中有一个选择，其中包含带有引导弹出窗口的选项，其中包含每个选项的更详细描述。目前无论我在弹出框初始化中设置placement选项是什么，它都会在选择框的中间弹出，覆盖列表中的其他选项。 select 允许选择多个选项，因此这对于用户体验来说并不理想。看着类似的问题，我认为设置 container: 'body' 会有所帮助，但问题仍然存在，如下所示：

弹幕

我当前的弹出框初始化：

$('#selectId>option').popover(
    container: 'body',
    html: true,
    placement: 'right',
    trigger: 'manual',
);

我尝试将位置更改为“左”、“上”和“下”，无论我使用哪个选项，当我使用$('#selectId>option').popover('show')触发它时，弹出框都会出现在相同的位置

【问题讨论】：

根据documentation，您必须包含 popper.js 用于定位或使用捆绑版本的引导程序。你包括了吗？

@ümitAltuntaş 是的，我正在使用包含 popper.js 的捆绑版本

【参考方案1】：

尝试为选择框提供更多宽度（空间），因为有时“弹出框”需要更多空间来放置该位置。

data-placement="right"

并使用这样的属性。