小编典典

动态地向Bootstrap的“ popover”容器添加类

css

我已经对StackOverflow和Google进行了彻底的搜索,但是空着。如果已经提出并解决此问题,请提前道歉。

注意: 我是jQuery的新手,所以我不确定如何自己编写。我敢肯定这是一段简单的代码,但是我不能将其束之高阁。

我想要做的是使用一个data-元素(例如:data-class或类似元素)将新类(或ID,我不再挑剔!)附加到顶级popover
<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>

这是我能做的吗?引导程序站点中有关弹出窗口的文档有点稀疏,所以很遗憾,我花了一段时间才到达这一点:(

预先感谢您的所有回复!


阅读 483

收藏
2020-05-16

共1个答案

小编典典

通过从调用者的抓取对象data并访问其$tip属性,就可以做到这一点,而无需破解Bootstrap或更改模板。

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