jquery - 向动态创建的元素添加不同的 Twitter Bootstrap 弹出框

Question

我正在尝试将弹出框添加到动态创建的元素中。每种元素（ContentEditable 或 Img 或 Video）都需要有不同的弹出框内容。

因为它们是动态元素，所以我将弹出框称为如下：

$('body').popover({
            selector: '[rel=popoverImage]',
            content: **popoverImage**,
            html: true,
            placement: 'top',
            trigger: 'focus'
        });

wherepopoverImage是一个变量，其中包含 img 元素的弹出框内容。

当我尝试添加另一个弹出框时，问题就来了。它没有显示。我尝试了以下方法：

1. 有 2 个选择器并在不同的$('body')popover({...})函数中调用它们。
2. 将元素更改body为动态生成的容器。
3. 每次聚焦新元素时更改具有“内容”数据的变量。

有任何想法吗？

Answer 1

您需要的是在添加新控件时同时添加弹出框：

function AddNewElement()
{
  var yourElement = '<div id="yourElementId"> The element you want </div>';
  $('divToAppend').append(youElement);

  var yourPopoverContent = 'Your Personalized popover';

  $('#yourElementId').popover({
      html : true,
      content : yourPopoverContent      
  });

}

这应该适用于弹出框的实际代码。