twitter-bootstrap - Make Twitter's Bootstrap 2.x Popover use the default Popover title instead of that in the html title attribute?

Question

I have the following anchor element that when clicked should show a Twitter Bootstrap Popover:

<a href="javascript:void(0)" class="popover_toggle" title="View Image">View Image</a>

I also have the following javascript to attach the popover and set a default title for it:

$('.popover_toggle').popover({
    title: 'Login Required!'
});

I would like the Popover to have the default title defined in the javascript "Login Required!", and not the title defined in the anchor element "View Image". How can I achieve that?

Answer 1

正如http://twitter.github.io/bootstrap/javascript.html#popovers（如果属性不存在，则默认标题值title）告诉您：如果您的元素具有空或无标题属性，则只能设置标题。

当标题选项设置为字符串时，它会在文档就绪时进行评估。在此处使用函数（触发时评估）仍然不起作用。

Popovers 是工具提示类的扩展。它的构造函数调用 fixTitle()。fixTitle() 将内容从 title-attribute 移动到 data-orginal-title 属性。因为这是在调用 setTitle() 之前完成的，所以您不能使用 title 函数。

要解决您的问题，请否决 popover 类的 fixTitle()：

$.fn.popover.Constructor.prototype.fixTitle = function () { return; }

现在 popover 将忽略（您的 title 属性）并使用您在 popover 调用中设置的标题：

html：

   <a href="javascript:void(0);" class="popover_toggle" title="View Image">View Image</a>

javascript：

$.fn.popover.Constructor.prototype.fixTitle = function () {return;}
$('.popover_toggle').popover({
    title: 'Login Required!',
});

另见：http ://bootply.com/66591