Question

Bootstrap 3 工具提示和 popovers 在html代码中完美运行，但它似乎不适用于动态构建的条目。例如：

urlline += '<a href="' + this + '" target="_blank" ';
urlline += 'data-content="' + ircline + '" ';
urlline += 'data-placement="bottom" ';
urlline += 'data-container="body" ';
urlline += 'data-toggle="popover">';
urlline += this + '</a>';

在这种情况下，创建的链接上的hover不会显示任何popover。与tooltips相同的结果。我popover初始化了$('[data-toggle="popover"]').popover({trigger: 'hover'});，它适用于现有的 HTML ，而不适用于动态创建的条目。

我没有JS专家，所以我可能会遗漏一些东西，任何提示？

Answer 1

您是否使用jQuery将urlline插入DOM，类似于$('#somelementID').html(urlline);？如果是，则使用jquery在使用$('a#id').popover({trigger: 'hover'});

将该元素插入DOM后初始化bootstrap popover / tooltip

Answer 2

尝试使用js中的函数和popover的属性，即使在你的内容中你也可以使用ajax o根据你的喜好放置一个html代码或者最后的参数（这对我来说在datatable中工作）：

function popovers(object, title, content, placement){
    $(objet).popover({
      html:true, 
      title: title,
      content: content,
      placement: placement
})
}

JS动态条目的Bootstrap工具提示和弹出框

2 个答案: