Popover в Bootstrap3 - как сделать так, чтобы он не игнорировал клик по контенту

Question

Я хочу, чтобы мой поповер не рассеивался при щелчке по контенту при использовании триггера фокуса, потому что в нем есть входные данные.

Вот мои атрибуты div:

data-toggle="popover" data-content="<input type='text' class='form-control'><button class='btn btn-sm btn-default' style='margin-top:5px'>Zapisz</button>" data-title="Description" data-html="true" data-trigger="focus" data-container="body"

Итак, как вы можете видеть, у меня есть простой поповер, который запускается с фокусом (я знаю, что это может быть причиной того, что он закрывается при щелчке), но я должен закрыть поповер при нажатии в другом месте на экране, поэтому я ' м, используя trigger="focus".

Answer 1

Вы можете добавить слушателя (hide.bs.popover) к поповеру и предотвратить выполнение события. В этом случае вам нужно добавить дополнительный слушатель, чтобы вручную закрыть его по нажатию кнопки. Нечто подобное должно работать.

<script>
$(document).ready(function(){
    $('[data-toggle="popover"]').popover({html: true});  

    $("[data-toggle='popover']").on('hide.bs.popover', function(e){
        e.preventDefault();
    });

    $("[data-toggle='popover']").on('shown.bs.popover', function(e)
    {
        // create your own listener after popover has shown
        $("#your_button").on('click', function(e){
            $("[data-toggle='popover']").off('hide.bs.popover');
            $("[data-toggle='popover']").popover('hide');
        });
    });
});
</script>

Надеюсь, это поможет.