Bootstrap.popover() 'show' & 'destroy' не работает должным образом

Когда я использую bootstrap popover в режиме "manual", "destroy" и "hide" работают неправильно. Когда я использую hide и destroy, непрозрачность popover меняется на 0, но на его не меняющемся дисплее нет ни одного, что приводит к тому, что контейнер popover покрывает содержимое ниже. В противном случае, если я использую режим "toogle", он работает правильно.

Мой код:

$('[rel="popover"]').popover({
    html: true,
    placement: 'auto',
    container: 'body',
    trigger: 'manual'
});

$('body').on('click' , '[rel="popover"]' , function(e){
    e.stopPropagation();
    $(this).popover('toggle');
});

$('body').on('click' , '.popoverClose' , function(e){
    e.stopPropagation();
    var i = $(this);
    $('.inputInfo').filter('[data-info-id="' +i.data('info-id')+ '"]').popover('hide');
});

// new code
$('body').on('click', function(){
    $('[rel="popover"]').popover('hide');
});

ОТВЕТЫ

Ответ 1

Мое временное решение выглядит так:

Я использую:

$('.popover').remove();

удалить popovers

и

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

    var i = $(this);
    var thisPopover = $('.popoverClose').filter('[data-info-id="' +i.data('info-id')+ '"]').closest('.popover');        
    if( thisPopover.is(':visible') ){
        $('.popover').remove();
    }
    else{
        $(this).popover('show');
    }
});

для переключения popovers

Ответ 2

Если вы использовали пользовательскую сборку Bootstrap, событие destroy не будет работать, если вы не отметили "переходы" в разделе JS и тестируете в браузере, который поддерживает переходы. Это связано с тем, что Bootstrap смотрит на $.support.transition в jQuery. Если это значение является "правдивым", Bootstrap предполагает, что произойдет какое-то событие переходаEnd и не будет отделять popover до тех пор, пока это событие не будет получено. Но Bootstrap использует пользовательские события, определенные в их библиотеке переходов, поэтому вызов переходаEnd никогда не будет запущен. Если вы не хотите повторно загружать настроенную библиотеку, код перехода находится здесь: код перехода

Ответ 3

Если вы хотите скрыть popover, используйте это вместо:

$('.inputInfo').filter('[data-info-id="' +i.data('info-id')+ '"]').click();

Ответ 4

Работа для начальной загрузки

<span class="pop-target">
      <a href="javascript:void(0);" rel="popover"........> </a>
    </span>



  $(".pop-target a").popover('hide');

Ответ 5

Я исправил его, добавив это в файл css:

.popover.fade{z-index:-1;}

.popover.in{z-index: inherit}