Javascript 如何使Twitter引导工具提示有多行？

我目前正在使用下面的函数来创建文本，该文本将使用Bootstrap的工具提示插件显示。为什么多行工具提示仅适用于

，而不适用于

\n

？我希望我的链接的标题属性中没有任何HTML

什么有效

def tooltip(object)
  tooltip = ""
  object.each do |user|
    tooltip += "#{user.identifier}" + "<br>"
  end
  return tooltip
end

---

您可以使用html属性：

我的测试。

$('.my_tooltip').tooltip({html: true})

---

您可以在工具提示上使用

空白：预换行

。这将使工具提示与新行相关。如果线条的长度超过容器的默认最大宽度，则线条仍将换行

.tooltip-inner {
    white-space:pre-wrap;
}

如果要防止文字换行，请执行以下操作

.tooltip-inner {
    white-space:pre;
    max-width:none;
}

---

这两种方法都不适用于html中的

\n

，它们实际上必须是实际的换行符。或者，您可以使用编码的换行符

，但这可能比使用

更不可取。
如果您使用的是Angular UI引导，您可以使用带有html语法的工具提示：
工具提示html不安全

e、 g。
更新至angular 1.2.10和angular ui引导程序0.11：

旧版本：
如果您在非链接元素上使用Twitter引导工具提示，您可以指定，您希望直接在HTML代码中使用多行工具提示，而不使用Javascript，只使用
数据
参数：

<span rel="tooltip" data-html="true" data-original-title="1<br />2<br />3">5</span>

5

这只是costales回答的另一个版本。所有的荣耀都属于他！：]
 在Angular UI Bootstrap 0.13.X中，工具提示html不安全已被弃用。现在应该使用工具提示html和$sce.trustAsHtml（）来完成html工具提示



$scope.htmltoltip=$sce.trustAsHtml（'我被加粗了！'）；
角度引导的CSS解决方案是

::ng-deep .tooltip-inner {
  white-space: pre-wrap;
}

如果不需要限制父元素或类选择器的使用，则无需使用它。
Copy/Pasta，此规则将适用于所有子组件
您了解HTML中\n和
之间的区别吗？
将在HTML呈现端工作，而/n将仅在新行中显示您的HTML代码我正在查看一些其他网站，它们有多行工具提示，但没有br您尚未选中
引导2.0.2（仅限js）JSFIDLE中的
选项，这使得它在初始运行时不起作用（打开）。标记并保存它，这样其他人就不会遵守，说明您的示例不起作用。为什么说“非链接元素”？我在一个链接上尝试了这个，它似乎很好。嗯……我不记得了！：]五个月后，我想我错了。我也不知道，为什么它不应该在链接上工作。对不起……这个对我很有效，特别是如果你用javascript触发工具提示，它将加载到元素本身，谢谢！现在你如何用popover@aaa90210您可以试试
.popover content{white space:pre wrap；}
。根据您的内容，
.popover content p{white space:pre wrap；}
或类似的东西，看起来会更好。是否可以在工具提示中这样显示JSP变量？我已经尝试了
。但是它给出了这个：aaabbbcc（连接的字符串）…工具提示内部{空白：pre-line；}对我有效。pre-line对我有效-所有其他文本未正确对齐
<a href="#" tooltip-html="htmlTooltip">Check me out!</a>

$scope.htmlTooltip = $sce.trustAsHtml('I\'ve been made <b>bold</b>!');

::ng-deep .tooltip-inner {
  white-space: pre-wrap;
}