jquery - 动态添加类到Bootstrap的 'popover'容器

Question

我已经通过 StackOverflow 和 Google 进行了全面搜索，但一无所获。如果已经提出并解决了这个问题，请提前致歉。

注意:我是 jQuery 的新手，所以我不确定自己该如何编写。我确信这是一段简单的代码，但我无法理解它。

我想做的是使用 data-元素(例如:data-class 或类似的)将新类(或 ID，我不再挑剔了!)附加到顶级弹出窗口 <div> .我目前的代码如下:

jQuery:

$('a[rel=popover]')
    .popover({
        placement : 'bottom',
        trigger : 'hover'
    })
    .click(function(e) {
        e.preventDefault()
    });

HTML:

<a href="" rel="popover" data-class="dynamic-class" title="Title goes here" data-content="Content goes here">

理想情况下，我会吐出的 HTML 是这样的:

<div class="popover ... dynamic-class">
    <!-- remainder of the popover code as per usual -->
</div>

这是我能做的吗？弹出窗口的 Bootstrap 站点上的文档有点稀疏，所以我花了一段时间才明白这一点，不幸的是:(

提前感谢您的所有回复!

Answer 1

通过从调用者的 data 中获取 popover 对象并访问其 $tip 属性，您可以在不破解 Bootstrap 且不更改模板的情况下做到这一点。

$('a[rel=popover]')
  .popover({ placement: 'bottom', trigger: 'hover' })
  .data('bs.popover')
  .tip()
  .addClass('my-super-popover');