jquery - 加载新内容时 bootstrap-popover 不会隐藏

Question

在我的代码中，我有一个 div，我用它来使用 JQuery 加载不同的内容类型，现在我加载到 div 中的新内容具有弹出窗口，问题是弹出窗口不会消失当我将新内容加载到 div 中时，它们几乎就像被附加到新内容上一样。

当新内容加载到 div 中时，如何使它们消失？

HTML

<div class='box-nfh genericGreyBackground'>
    <div class='box_74'>
        <h2>Performance management is an ongoing process of communication between a supervisor and an employee that occurs throughout the year, in support of accomplishing the strategic objectives of the organisation. It involves five distinct actions. </h2> 
        <div class='pentagonContainer'>
            <div class='pentagon'>
                <img src='images/pentagon.png'>
                <span class='pentagonCircle' id='penBtn1' type='button' data-container='body' data-toggle='popover' data-placement='top' data-content='Clarify expectations'> 1 </span> 
                <span class='pentagonCircle' id='penBtn2' type='button' data-container='body' data-toggle='popover' data-placement='top' data-content='Set objectives'> 2 </span> 
                <span class='pentagonCircle' id='penBtn3' type='button' data-container='body' data-toggle='popover' data-placement='top' data-content='Identify goals'> 3 </span> 
                <span class='pentagonCircle' id='penBtn4' type='button' data-container='body' data-toggle='popover' data-placement='top' data-content='Provide feedback'> 4 </span> 
                <span class='pentagonCircle' id='penBtn5' type='button' data-container='body' data-toggle='popover' data-placement='top' data-content='Evaluate results'> 5 </span> 
            </div>
        </div>
    </div>
</div>

Answer 1

等待您回答如何将代码注入(inject)“div”，这是我的答案。

在注入(inject)新内容之前，您可以销毁现有的弹出窗口。这将从 UI/DOM 中删除它们(并释放进程中的一些内存)。

$('.pentagonCircle').popover('destroy')

您可能想要更改选择器，也许将其限制为特定的父级。

文档:http://getbootstrap.com/javascript/#popovers