使用 Jquery 将 html 附加到 div - 将 Bootstrap 工具提示添加到附加项

Question

我有一个 div: $(".results").随着事情的发展，结果会添加到此 div。其中之一是掷骰子，格式为 <kdb>

例如：

function resultBox(result, color="red"){ return "<kbd class='"+color+"'>"+result+"</kbd>";

默认的kdb颜色是红色，但我添加了这么多颜色（不同的结果类型有不同的颜色）。我想为每个 kdb 添加一个工具提示来解释颜色。

例如：

function resultBox(result, color="red"){
  return "<kbd class='"+color+"' data-toggle='tooltip' title='"+colorInfo(color)+"'>"+result+"</kbd>";
}

function colorInfo(color) {
  return "blah blah";
}

（我 不需要 colorInfo() 函数的帮助）我只是无法弄清楚为什么 Bootstrap 工具提示没有正确显示。（意思是：我看到的是标准工具提示，就好像我没有添加 Bootstrap。而不是看到带有小箭头的 Bootstrap 默认黑色工具提示）

在您回答之前请注意

Bootstrap 工具提示的格式正确。这已添加到我的 javascript 主页。 $('[data-toggle="tooltip"]').tooltip(); 我可以正常使用 Bootstrap 工具提示，只需将它们写成 HTML 即可。

我只是不确定在 Javascript

中动态创建它们时如何绑定它们

编辑：这不是重复的。问题已得到解答。在 "possible duplicate"

中未找到答案

Answer 1

你需要运行 $(#AddedItems).tooltip() 功能，一旦你在 DIV.

追加一些东西

注意： 这不起作用，因为此函数 ($('[data-toggle="tooltip"]').tooltip()) 仅适用于 dom 中可用的元素 dom。

使用 Jquery 将 html 附加到 div - 将 Bootstrap 工具提示添加到附加项

Appending html to a div using Jquery - add Bootstrap Tooltip to appended items

jquery

tooltip

twitter-bootstrap