jquery – Bootstrap popover内容不能动态更改

前端之家收集整理的这篇文章主要介绍了jquery – Bootstrap popover内容不能动态更改前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我使用的代码如下:
$(".reply").popover({
  content: "Loading...",placement: "bottom"
});

$(".reply").popover("toggle");

这将正确创建popover及其内容。我想加载一个新的数据到popover而不关闭popover。

我试过以下:

var thisVal = $(this);
$.ajax({
  type: "POST",async: false,url: "Getdes",data: { id: ID }
}).success(function(data) {
  thisVal.attr("data-content",data);
});

在此调用之后,元素中的数据将更改,但不会显示在弹出窗口中。

我应该怎么做呢?

解决方法

如果你像这样抓住popover实例:
var popover = $('.reply').data('bs.popover');

然后,要重绘弹出框,请使用.setContent()方法

popover.setContent();

我发现浏览源代码https://github.com/twitter/bootstrap/blob/master/js/popover.js

因此,在您的示例中,尝试:

thisVal.attr('data-content',data).data('bs.popover').setContent();

更新

setContent()方法也会删除展示位置类,因此您应该执行以下操作:

var popover = thisVal.attr('data-content',data).data('bs.popover');
popover.setContent();
popover.$tip.addClass(popover.options.placement);

演示:http://jsfiddle.net/44RvK

猜你在找的jQuery相关文章