Twitter 的带有选择器和 data-* 属性的 Bootstrap 弹出框

Question

使用

$(document).popover({
    selector: '.selector'
});

忽略目标元素中指定的任何data-* 属性。
例如

<a class="selector" title="bla" data-content="some html" data-html="true">link</a>

popover 将跳过data-html 属性。

证明：http://jsfiddle.net/YsEqb/

问题是：如何让引导程序在委托附件的情况下考虑data-* 属性 ({ selector: '.selector' })？

UPD
这是confirmed as bug 和fixed。 3.0.0版不会有这个bug。

Answer 1

未使用数据元素，因为它们是在初始化而不是在元素显示时设置的。这不适用于仅对初始化器中的所有设置使用相同选项的选择器。我不知道这是一个错误。 （更新是的，它已修复：https://github.com/twbs/bootstrap/issues/9222）

快速修复扩展您的显示功能并在此处（再次）设置选项：

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/js/bootstrap.min.js"></script>
<script>    

var tmp = $.fn.popover.Constructor.prototype.show
$.fn.popover.Constructor.prototype.show = function () {
  var $e = this.$element
  if (typeof($e.attr('data-html')) != 'undefined')this.options.html = ($e.attr('data-html')==='true') 
  if (typeof($e.attr('data-placement')) != 'undefined')this.options.placement = $e.attr('data-placement');
  /* add other options here */
  tmp.call(this);
}

这适用于 Twitter 的 Bootstrap 2.x 和 Twitter 的 Bootstrap 3(RC1)

另见：http://jsfiddle.net/bassjobsen/YsEqb/1/

请注意，当使用上述 CDN 时，关闭弹出框时会出现 JS 错误（TypeError: this.remove is not a function）请参阅：https://github.com/twbs/bootstrap/issues/8887

Answer 2

指定选择器时，您会将 data-html 值重置为默认值 false

如此明确地说明：

$(document).popover({
    selector: '[data-toggle="popover"]',
    html:true
});

在这种情况下会将 data-html 值设置为 true。 JS fiddle

Answer 3

而不是使用

 $(document).popover({
    selector: '.selector'
});

如果你想使用选择器，那么这是代码：

$('body').popover({
        selector: '.selector'
    });

或

$('.selector').popover();