Twitter Bootstrap Popovers不适用于动态生成的内容

Question

在这里发布stackoverflow的新手，所以如果我把这里搞砸了，我提前道歉。

我正在使用Twitter Bootstrap的popovers。 我的popovers似乎适用于我手动输入到我的HTML文档中的元素 - 但不是我通过Javascript / Ajax动态生成的元素。

例如，如果我手动将其直接添加到我的HTML文档中，则popover似乎有效：

<p rel=popover data-content='It is so simple to create a tooltop for my website!' data-original-title='Twitter Bootstrap Popover'>hover for popover</p>

但我真正需要的是我动态生成的元素有弹出窗口。 我使用XMLHttpRequest向PHP文件发送请求，然后获取responseText并显示它。 当我将这行代码添加到我前面提到的PHP文件中时：

 echo "<p rel=popover data-content='It is so simple to create a tooltop for my website!' data-original-title='Twitter Bootstrap Popover'>hover for popover</p>";

......当然，出现了“悬停于弹出窗口”的字样 - 但是弹出窗口本身不起作用！

这让我疯了一段时间，如果有人可以伸出援助之手，那将是不可思议的！ 我还添加了我正在使用的JQuery函数来启用下面的Bootstrap的popovers，这是值得的。

$(function (){
$("[rel=popover]").popover({placement:'left'});
}); 

我已经彻底搜索了类似的问题，我能找到的最好的就是这个链接 。 但是这个链接似乎也没有任何解决方案。 再次感谢！

更新：

固定！ 非常感谢所有帮助过的人。 我的问题是在将元素添加到文档对象模型之前调用该函数。 有多种可能的修复方法 - 我只是通过将popover函数转移到Ajax函数的END来测试解决方案，并且它有效！

Answer 1

你需要调用$("[rel=popover]").popover({placement:'left'}); 元素在DOM之后。

UPDATE

如果你正在使用jQuery

$(element_selector)
  // load results into HTML of element_selector
  .load('your/php/file')
  // when done, initialize popovers
  .done(function(){
    $("[rel=popover]").popover({placement:'left'});
  });

或者为jQuery ajax请求捕获所有内容

$.ajaxComplete(function(){
    $("[rel=popover]").popover({placement:'left'});
  });

Answer 2

在ajax的成功函数中，你需要调用popover。 像这样的东西

success:function(){
  $("[rel=popover]").popover({placement:'left'});
}

Answer 3

此函数将在选择器中正常工作，您必须在页面上指定您必须搜索“rel = popover”的位置，就像我放*

$(function ()  
{
console.info($("*[rel=popover]"));
$("*[rel=popover]").popover();
});