使用ajax无法正常加载popover内容

时间:2015-04-29 05:46:46

标签: javascript jquery ajax twitter-bootstrap

我正在使用ajax调用来显示我页面中弹出窗口中不同产品的show方法内容。

我使用以下代码:

function details_in_popup(link, div_id){
    $.ajax({
        url: link,
        success: function(response){
            $('#'+div_id).html(response);
        }
    });
    return '<div id="'+ div_id +'">Loading...</div>';
}

$(function () {
  $('[data-toggle="popover"]').popover({
    "html": true,
    "title": '<span class="text-info"><strong>title</strong></span>'+
            '<button type="button" id="close" class="close" >&times; </button>',
    "content": function(){
        var div_id =  "tmp-id-" + $.now();
        return details_in_popup($(this).data('url'), div_id);
    }


  }).on('shown.bs.popover', function(e){
  var popover = jQuery(this);
  $('body').on('click','.close', function(e){
    popover.popover('hide');
  });
 });
});

我遇到的问题是,我第一次打开一个弹出窗口,内容得到正确填充,第二次,我在弹出窗口中获得标题重复,然后第三次,第一次来自第一个弹出窗口和第二个一个人搞砸了。

如果之前的popovers从未被清理过,并且每次我打开一个新的popover都会积累...

代码中是否有明显可能会产生此问题的内容?

谢谢!

1 个答案:

答案 0 :(得分:0)

使用

重置ajax success上的div
$('#'+div_id).text('');

而不是追加回复。