使用twitter bootstrap创建工具提示/弹出窗口后的回调函数？

我想用twitter bootstrap创建工具提示或弹出窗口。 据我所知，没有建立方式来做到这一点。

$('#selector').popover({ placement: 'bottom' }); 

例如，假设我想将创建的工具提示向上移动5px并从其计算位置离开5px。 有关最佳方法的任何想法吗？

这就是我想做的事情：

 $('#selector').popover({ placement: 'bottom', callback: function(){ alert('Awesome'); } }); 

Answer 1

适用于工具提示：

 var tmp = $.fn.tooltip.Constructor.prototype.show; $.fn.tooltip.Constructor.prototype.show = function () { tmp.call(this); if (this.options.callback) { this.options.callback(); } } this.$('#selector').tooltip({ placement: 'top', callback: function() { alert('hello') } }); 

Answer 2

在给出之前的答案时可能无法使用此function，但截至2016年，您可以将事件附加到弹出窗口（function上等同于回调）。

例如

 $('#myPopover').on('shown.bs.popover', function () { // do something… }) 

活动包括：

• show.bs.popover
• shown.bs.popover
• hide.bs.popover
• hidden.bs.popover
• inserted.bs.popover

参考bootstrap文档

Answer 3

发布此答案只是为了澄清Crafter所要求的内容，并包含Marquez评论中的代码。

首先，您可以扩展Bootstrap的popover来处理callback选项。

 var tmp = $.fn.popover.Constructor.prototype.show; $.fn.popover.Constructor.prototype.show = function() { tmp.call(this); if (this.options.callback) { this.options.callback(); } } 

然后，向选项对象添加一个callback属性，并使用匿名函数为其分配。

 $('#popover-foo').popover({ content: 'Hello world', callback: function () { alert('Hello'); } }); 

Answer 4

其他解决方法：

1. 使用show.bs.popover或shown.bs.popover侦听器

2. 在回调中，“显示的”事件数据链接到保存弹出ID的目标，从这里你可以完成剩下的工作

    $('body') .popover(options) .on('shown.bs.popover', function(shownEvent) { update_popover_data(shownEvent); }); 

回调function：

  function update_popover_data(shownEvent) { var id = $(shownEvent.target).attr('aria-describedby'); $('#'+id).html('Your New Popover Content'); }