Bootstrap Popover

Question

Я хотел был бы хотеть щелкнуть вне popover для того чтобы сделать его dissapear.

Этот код работает хорошо - закрывает один popover, когда другой открывается и, когда вы снова зажимаете кнопку, он уходит.

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 = ''; 
    } 
});​ 

Мне нужно, чтобы сохранить эту текущую функциональность, но изменить его так, что он делает то же самое, когда вы щелкните вне пирог, а также.

Answer 1

Когда нажата кнопка открытия Popover, она должна получить фокус. Когда вы нажимаете, он теряет фокус, и вы можете поймать его с помощью .blur(), а затем используйте popover('hide').

Answer 2

$.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() 

      }) 
    }) 
}) 

Answer 3

вы можете это сделать, просто добавив:

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

jsfiddle

Answer 4

Этот маленький трюк очень удобно, если вы хотите, чтобы закрыть все остальные Popovers за исключением того, что было щелкнули:

$('.popover').click(function (evt) { 
    evt.stopPropagation(); 
    $('.popover').not(this).popover('hide'); 
}); 

Answer 5

Добавить этот код в конец bootstrap.min.js
1) 2 поповеров были всегда нажмите скрыть старые поповером
2) нажмите вне пирог скроют также

$count=0;$(document).click(function(evt){if($count==0){$count++;}else{$('[data-toggle="popover"]').popover('hide');$count=0;}});$('[data-toggle="popover"]').popover();$('[data-toggle="popover"]').on('click', function(e){$('[data-toggle="popover"]').not(this).popover('hide');$count=0;});