このポップオーバーをトリガーした親要素がDOMから削除された場合、どのようにブートストラップポップオーバーを非表示にしますか?親要素が削除された場合、ブートストラップポップオーバーを非表示にする
ユーザーがページのボタンをクリックすると、一部のコンテンツがajax経由でdivに読み込まれます。次に別のボタンをクリックすると、別のAjaxコールがこの同じdiv内のコンテンツを置き換えます。
このdiv要素にロードされたコンテンツは以下のようにブートストラップポップオーバーをトリガとして動作する要素が含まれ、この1:
$(document).ajaxSuccess(function(){
var init = function() {
$('[data-toggle="popover"]').each(function(index) {
initPopover(this); //This is where the popover gets initialized
});
}
window.setTimeout(init,100); // set timeout to prevent function from being executed before content is replaced
});
問題の後:popoversが成功するたびにAJAX呼び出しの後に初期化されます
<a class="infolink" data-toggle="popover" data-title="some title" data-placement="bottom" data-trigger="hover click" ></a>
ajax呼び出しは、ポップアップが表示された場合、親要素が削除された後でも表示されたままになります。これは、Googleの結果によると、ポップオーバーやダイアログの珍しい問題ではありませんが、私が今までに遭遇した解決策は、私にとってとても清潔ではありませんでした。
2つの解決策があります。
ajaxが成功するとすべてのポップオーバーを非表示にします。これはオプションではありません。なぜなら、私のポップオーバーのコンテンツは、一旦開かれると、ajaxを介して動的にロードされるからです。
すべてのトリガー要素を配列に格納します。 Ajaxの成功イベントが発生したら、その配列をループし、その要素がまだ存在するかどうかを確認します。
//Pseudocode
var popoverTriggers = [];
$('[data-toggle="popover"]').each(function(index) {
popoverTriggers.push(this);
}
私には非常にきれいではありません。
誰かがこれを行うより良い方法を知っていますか?
[外部をクリックしてTwitter Bootstrapのポップオーバーを解除するにはどうすればいいですか?](http://stackoverflow.com/questions/11703093/how-to-dismiss-a-twitter-bootstrap-popover-by-clicking-外側) – sparkyShorts