Bootstrap Popover内容不能动态更改 [英] Bootstrap popover content cannot changed dynamically
问题描述
我使用以下代码:
$(".reply").popover({
content: "Loading...",
placement: "bottom"
});
$(".reply").popover("toggle");
可正确创建弹出窗口及其内容.我想在不关闭弹出窗口的情况下将新数据加载到弹出窗口中.
which creates the popover and its content correctly. I want to load a new data into the popover without closing the popover.
我尝试了以下操作:
var thisVal = $(this);
$.ajax({
type: "POST",
async: false,
url: "Getdes",
data: { id: ID }
}).success(function(data) {
thisVal.attr("data-content", data);
});
此调用之后,元素中的数据将更改,但显示的弹出窗口中的数据将不会更改.
After this call the data in the element is changed but not in the popover which is shown.
我应该怎么做?
推荐答案
如果您像这样抓住弹出窗口实例:
If you grab the popover instance like this:
var popover = $('.reply').data('bs.popover');
然后,要重绘弹出窗口,请使用.setContent()
方法:
Then, to redraw the popover, use the .setContent()
method:
popover.setContent();
我发现浏览源代码: https://github.com/twitter/bootstrap/blob/master/js/popover.js
因此,在您的示例中,尝试:
So, in your example, try:
thisVal.attr('data-content',data).data('bs.popover').setContent();
更新
setContent()
方法还删除了展示位置类,因此您应该这样做:
The setContent()
method also removes the placement class, so you should do:
var popover = thisVal.attr('data-content',data).data('bs.popover');
popover.setContent();
popover.$tip.addClass(popover.options.placement);
这篇关于Bootstrap Popover内容不能动态更改的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!