更新

Question

如果我将鼠标悬停在附加文本上，那么它也会显示工具提示。如何防止这种情况，因此不应该为新创建的元素触发？

$(document).ready(function() {
  $('[data-toggle="tooltip"]').tooltip();
  $('[data-toggle="tooltip"]').append("<b>Appended text</b>");
});

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.js"></script>
<div class="container">
  <h3>Tooltip Example</h3>
  <div data-toggle="tooltip" title="Hooray!">Hover over me</div>
</div>

Answer 1

append()表示您将新创建的元素插入到具有工具提示的父级中。当然，工具提示出现是因为你将新元素放在里面。

如果要将新元素放在具有工具提示的元素之外（因此它们没有工具提示），请使用after()：

$(document).ready(function() {
  $('[data-toggle="tooltip"]').tooltip();
  $('[data-toggle="tooltip"]').after("<b>Appended text</b>");
});

更新

似乎我现在知道你的问题。如果你必须附加它并且不希望仅对该元素提供工具提示，那么通常是不可能的。解决方案是您应该将引导工具提示嵌入到特定子级而不是父级。像这样：

<div><span data-toggle="tooltip" title="Hooray!">Hover over me</span></div>

然后，您可以将<p>元素附加到<div>。而已。祝你好运！

如何防止将事件附加到bootstrap工具提示中新创建的元素

1 个答案:

更新