我正在使用推特引导弹出窗口，
在弹出窗口中，我添加一个按钮，
我需要将click处理程序附加到按钮， 但是 popover 的工作方式是每次显示它删除并重新创建元素，而不仅仅是显示/隐藏它，从而删除我与所述按钮关联的任何事件处理程序。
我正在创建几个弹出窗口，所有弹出窗口都带有自己的按钮版本，因此仅将类应用于弹出窗口是行不通的(除非我为每个弹出窗口生成不同的类：/)，按钮可能有也可能没有自己的 ID，所以不能应用 ID。
如何将事件处理程序应用于 Twitter 引导弹出窗口内容中的某些内容？
我遇到了同样的问题，就我而言，$(body).on('click')解决方法不起作用，因为该应用程序有很多单击按钮。
我做了以下操作。这样，我们可以将委托事件的范围限制为仅弹出框元素的父级。
$('a.foo').popover({
html: true,
title: 'Hello',
placement: 'bottom',
content: '<button id="close-me">Close Me!</button>'
}).parent().delegate('button#close-me', 'click', function() {
console.log('World!');
});
JS小提琴：http://jsfiddle.net/dashk/5Yz7z/
附言我在应用程序中的Backbone.View内使用了这种技术。这是Fiddle中的代码片段，以防您在Backbone.js中也使用它...：http://jsfiddle.net/dashk/PA6wY/
编辑 在 Bootstrap 2.3 中，您可以指定要将弹出框添加到的目标容器。现在，除了执行 .parent() 定位器之外，您还可以专门侦听容器的事件......这可以使侦听器更加具体(想象一下创建一个仅用于包含弹出框的 DIV。
这应该可以做到。 这将处理在具有 .popover 类的元素中创建的任何现有和将来的按钮元素：
$('body').on('click', '.popover button', function () {
// code here
});
对我有用的非常简单的解决方案是：
// suppose that popover is defined in HTML
$('a.foo').popover();
// when popover's content is shown
$('a.foo').on('shown.bs.popover', function() {
// set what happens when user clicks on the button
$("#my-button").on('click', function(){
alert("clicked!!!");
});
});
// when popover's content is hidden
$('a.foo').on('hidden.bs.popover', function(){
// clear listeners
$("#my-button").off('click');
});
为什么这样做： 基本上，弹出框的内容在打开弹出框之前没有侦听器。
当显示弹出框时，引导程序会触发其事件shown.bs.popover。我们可以使用 jQueryon方法将此事件上的事件处理程序附加到$(a.foo)。因此，当显示弹出框时，将调用处理程序(回调)函数。在此回调中，我们可以将事件处理程序附加到弹出框的内容 - 例如：当用户单击弹出框内的此按钮时会发生什么。
关闭弹出框后，最好删除弹出窗口内容的所有附加处理程序。这是通过hidden.bs.popover处理程序完成的，该处理程序使用 jQuery.off方法删除处理程序。这可以防止再次打开弹出框时调用弹出框中的事件处理程序两次(甚至更多次)...
只是稍微更新一下DashK非常好的答案：.delegate()在jQuery 1.7起已被.on()取代(见这里)。
$('a.foo').popover({
html: true,
title: 'Hello',
placement: 'bottom',
content: '<button id="close-me">Close Me!</button>'
}).parent().on('click', 'button#close-me', function() {
console.log('World!');
});
在这里看jsfiddle：http://jsfiddle.net/smingers/nCKxs/2/
我在将.on()方法链接到$('a.foo')时也遇到了一些问题;如果您遇到这样的问题，请尝试将其添加到文档，正文或html中，例如：
$('a.foo').popover({
html: true,
title: 'Hello',
placement: 'bottom',
content: '<button id="close-me">Close Me!</button>'
});
$('body').on('click', 'button#close-me', function() {
console.log('World!');
});
$('.btn-popover').parent().delegate('button#close-me','click', function(){
alert('Hello');
});
如果在静态 html 中设置数据属性，则上述方法工作正常。谢谢:)
如果在弹出框的内容中添加更复杂的结构(例如外部组件)，可能会遇到麻烦。对于这种情况，这应该可以解决问题。
var content = $('<button>Bingo?</button>');
content.on('click', function() {
alert('Bingo!')
});
$('a.foo').popover({
html: true,
content: content
}).on('hidden.bs.popover', function() {
content.detach(); # this will remove content nicely before the popover removes it
});
试试这个
var content = function() {
var button = $($.parseHTML("<button id='foo'>bar</button>"));
button.on('click', '#foo', function() {
console.log('you clicked me!');
} );
return button;
};
$( '#new_link' ).popover({
"html": true,
"content": content,
});