Question

我有一个表单，其中引导工具提示通过Javscript追加。这些元素具有HTML标题属性（just like in the bootstrap example），并且表单中还有一些元素具有使用HTML添加的弹出窗口。

出于某种原因，工具提示出现在我没有初始化它的元素上 - 这意味着我的弹出窗口和工具提示之间存在冲突。

我尝试使用<span> <div>和<button>之类的不同标签来尝试防止冲突，但我的popovers和工具提示会继续同时显示。

为什么会发生这种情况的任何想法？

Answer 1

我碰到了类似的东西，虽然我还没有弄清楚问题的根源（我确定我做了一些愚蠢的事情），但我找到了解决问题的方法。

您需要使用Bootstrap的默认选择器和标题属性以外的方式初始化工具提示或弹出窗口。

所以不要这样......

$('body').tooltip({
            container: 'body',
            selector: '[data-toggle="tooltip"]'
        });

<span data-toggle="tooltip" title="My Title" data-placement="top"></span>

这样做......

$('body').tooltip({
            container: 'body',
            selector: '.bs-tooltip',
            title : function () {
               return $(this).attr('tooltip-title');
            }
        });

<span class="bs-tooltip" tooltip-title="My Title" data-placement="top"></span>

只需确保更改选择器和标题。仅更改标题不会更正冲突，只更改选择器将导致Bootstrap将title和data-original-title属性添加到元素中，tootip或popover将查找它们的信息，因为它们是空无所事。

Bootstrap工具提示和popover冲突

1 个答案: