Twitter的具有选择器和data- *属性的Bootstrap弹出窗口 [英] Twitter's Bootstrap popover with selector and data-* attributes
问题描述
使用
$(document).popover({
selector: '.selector'
});
忽略目标元素中指定的任何data-*
属性.
例如
ignores any data-*
attributes specified in target elements.
For example
<a class="selector" title="bla" data-content="some html" data-html="true">link</a>
弹出窗口将跳过data-html
属性.
证明: http://jsfiddle.net/YsEqb/
问题是:在委派附件({选择器:'.selector'})的情况下,如何使引导程序考虑data-*
属性?
The question is: How make bootstrap take into account data-*
attributes in case of delegated attachment ({ selector: '.selector' }) ?
UPD
这已确认为错误和
UPD
This was confirmed as bug and fixed. Version 3.0.0 won't have this bug.
推荐答案
未使用数据元素,因为它们是在初始化时设置的,而不是在元素显示时设置的.对于仅对初始化器中所有设置都使用相同选项的选择器,这将不起作用.我不知道这是一个错误. (更新是的,它是固定的: https://github.com. com/twbs/bootstrap/issues/9222 )
The data-elements are not used caused they are set on initialization instead of on show of the element. This won't work for a selector which only use the same options for all set in your initializator. I don't know this is a bug. (update yes it is and it is fixed: https://github.com/twbs/bootstrap/issues/9222)
快速修复可扩展您的表演功能,并在那里(再次)设置选项:
Quick fix extend your show function and set the options (again) there:
<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)
This will work for Twitter's Bootstrap 2.x and Twitter's Bootstrap 3(RC1)
另请参阅: http://jsfiddle.net/bassjobsen/YsEqb/1/
请注意,当使用上述CDN时,关闭弹出窗口时会出现JS错误(TypeError:this.remove不是函数),请参见:
Note when using the CDN as above you will got a JS error on closing the popover (TypeError: this.remove is not a function) see: https://github.com/twbs/bootstrap/issues/8887
这篇关于Twitter的具有选择器和data- *属性的Bootstrap弹出窗口的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!