如何从 DOM 元素动态禁用弹出窗口？

Question

我在一个页面上有几乎相同的多个 div。它们里面都有图表，我希望其中一些在悬停时有弹出窗口。

我想为每个 div 决定弹出窗口是否可显示。是否有一个属性可以包含在内部选项中，例如 "diplay: false" ?

HTML

<div id="{{graph.id}}" data-ng-repeat="graph in graphs" data-placement="top" data-original-title="Parameters"></div>

JS

var options = {
    html: true,
    placement: 'top',
    trigger : 'hover',
    content: function() {
        return $('#info-chart-' + currentObj.id).html();
    }
}
$(currentObj.id).popover(options);

Answer 1

你可以添加一些 class 到那些你不想弹出的元素，比如 nopop class.

<div id="{{graph.id}}" class="nopop" data-ng-repeat="graph in graphs" data-placement="top" data-original-title="Parameters"></div>

现在更改 jquery 代码。

$(currentObj.id).not(".nopop").popover(options);

你可以在这里查看 --> JsFiddle

如何从 DOM 元素动态禁用弹出窗口？

How can I dynamically disable popover from a DOM element?

html

javascript

jquery

twitter-bootstrap

bootstrap-popover