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/

问题是：如果委托附件（{selector：'。selector“}），make bootstrap如何考虑data-*属性？

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

Answer 1

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

快速修复扩展您的show功能并在那里设置选项：

<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时，关闭popover时会出现JS错误（TypeError：this.remove不是函数）请参阅：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();

Twitter的Bootstrap popover，带有选择器和data- *属性

3 个答案: