3

ポップオーバーの外側をクリックして非表示にできるようにしたいと思います。

このコードはうまく機能しています - 別のポップオーバーが開いているときに1つのポップオーバーを閉じ、ボタンをもう一度クリックすると消えます。

var $visiblePopover;

$('body').on('click', '[rel="popover"]', function() {
  var $this = $(this);

  // check if the one clicked is now shown
  if ($this.data('popover').tip().hasClass('in')) {

// if another was showing, hide it
$visiblePopover && $visiblePopover.popover('hide');

// then store reference to current popover
$visiblePopover = $this;

  } else { // if it was hidden, then nothing must be showing
$visiblePopover = '';
  }
});​

この現在の機能を維持する必要がありますが、ポップオーバーの外側をクリックしたときにも同じことを行うように変更します。

4

5 に答える 5

1

次を追加するだけで簡単に実行できます。

$('html').click(function(e) {
     $('.btn').popover('hide');
});

jsfiddle

于 2013-04-22T18:20:31.807 に答える
1

クリックされたもの以外のすべてのポップオーバーを閉じたい場合、このちょっとしたトリックが便利です:

$('.popover').click(function (evt) {
    evt.stopPropagation();
    $('.popover').not(this).popover('hide');
});
于 2014-01-07T16:20:58.893 に答える
0 
$.fn.modal.Constructor = Modal
$(function () {
    $('body').on('click.modal.data-api', '[data-toggle="modal"]', function (e) {


if($visiblePopover && $visiblePopover){
alert("HIDE POPOVER WHEN MODAL IS OPENED")
$visiblePopover && $visiblePopover.popover('hide');
}
        var $this = $(this),
            href = $this.attr('href'),
            $target = $($this.attr('data-target') || (href && href.replace(/.*(?=#[^\s]+$)/, ''))),
            option = $target.data('modal') ? 'toggle' : $.extend({
                remote: !/#/.test(href) && href
            }, $target.data(), $this.data())
            e.preventDefault()
            $target.modal(option).one('hide', function () {
                $this.focus()

            })
    })
})
于 2013-03-04T09:28:15.123 に答える
-1

ポップオーバーを開くボタンをクリックすると、フォーカスが移動します。クリックするとフォーカスが失われ、.blur（）でキャッチしてから使用できる場合がありpopover('hide')ます。

于 2013-02-16T00:58:51.887 に答える