6

現在、ポップオーバーにコンテンツを動的に追加するスクリプトを呼び出していますが、ユーザーがもう一度クリックして閉じるときにこの呼び出しを行う必要はありません。状態を取得して、表示されているときに閉じることはできますか?

これは私がこれまでに持っているものです:

$('.knownissue').on('click', function() {

    var info = $(this).attr('id').substr(5).split(':');
    var el = $(this);

    // How do I check to see if the popover is visible
    // so I can simply close it and exit?

    $.post('functions/get_known_issues.php?tcid='+info[0]+'&tcdate=' + info[1], function(data) {
        if (data.st) {
            el.attr('data-content', data.issue);
            el.popover('toggle');
        }
    }, "json");

});
4

6 に答える 6

6
if($('.popover').hasClass('in')){
  // popover is visable
} else {
  // popover is not visable
}
于 2012-11-03T02:47:09.743 に答える
2

非表示および表示のイベントは、デフォルトでブートストラップ ポップオーバーで使用できます。

$('#myPopover').on('shown.bs.popover', function () {
  // do something…
})

ブートストラップ ポップオーバーの次のイベントが利用可能です

show.bs.popover	
shown.bs.popover
hide.bs.popover	
hidden.bs.popover

詳細については、ドキュメントのブートストラップ ポップオーバーを参照してください。

于 2014-11-14T08:22:35.277 に答える
0

ブートストラップはポップオーバーのマークアップを動的に追加および削除するため、要素の存在を確認するだけで済みます。

Bootstrap の例のページ: http://twitter.github.com/bootstrap/javascript.html#popoversにアクセスすると、そこに表示されている「クリックしてポップオーバーを切り替える」という大きな赤いボタンを使用して、例のポップオーバーを切り替えることができます。

この jquery セレクターは、存在する場合にそのポップオーバー要素を選択するように記述されています $('#popovers').find('h3').eq(5).next().find('.popover')

その状態 (存在するかどうか) を確認するには、返された要素セットの長さが 0 かどうかを確認します。

ボタンを押してポップオーバーの例を切り替え、コンソールで次のコマンドを実行します。

ポップオーバーをオンに切り替え

console.log( 
     $('#popovers').find('h3').eq(5).next().find('.popover').length === 0
); // false

ポップオーバーをオフに切り替え

console.log( 
    $('#popovers').find('h3').eq(5).next().find('.popover').length === 0
); // true

PS - ポップオーバーがページに存在するかどうかを確認する必要があることはすでにわかっているので、より良いセレクターを作成していただければ幸いです。

編集:jsfiddle HEREへのリンク

于 2012-11-01T20:52:56.230 に答える