我有问题与mattdlockyer的解决方案，因为我设置弹窗链接动态使用如下代码:

$('body').popover({
        selector : '[rel="popover"]'
});

所以我必须这样修改它。它为我解决了很多问题:

$('html').on('click', function (e) {
  $('[data-toggle="popover"]').each(function () {
    //the 'is' for buttons that trigger popups
    //the 'has' for icons within a button that triggers a popup
    if (!$(this).is(e.target) && $(this).has(e.target).length === 0 && $('.popover').has(e.target).length === 0) {
        $(this).popover('destroy');
    }
  });
});

记住destroy删除元素，所以选择器部分在初始化弹窗时很重要。

Bootstrap原生支持:

JS Bin演示

在下次单击时取消所需的特定标记 为了实现适当的跨浏览器和跨平台行为，必须使用<a>标记，而不是<button>标记，并且还必须包括role="button"和tabindex属性。

答案很好，只要添加一个angular指令，以防你像我一样使用angular:

app.directive('popover', ['$document', function($document) {
    return {
        restrict: 'EA',
        link: function(scope, elem, attrs) {
            $(document).ready(function() {
                $('[data-toggle="popover"]').popover();
            });

            elem.bind('click', function(e) {
                $('#notification').popover('toggle');
            })

            $('body').on('click', function (e) {
                //the 'is' for buttons that trigger popups
                //the 'has' for icons within a button that triggers a popup
                if (!elem.is(e.target)
                    && elem.has(e.target).length === 0
                    && $('.popover').has(e.target).length === 0) {
                    elem.popover('hide');
                }
            });
        }
    };
}]);

html代码:

<a popover tabindex="0" role="button"
   id="notification"
   data-toggle="popover" data-trigger="manual"
   data-container="body" data-placement="bottom"
   data-content="This is a popover">
   Popover button
</a>

它应该像使用data-trigger='click focus'一样简单，因为根据bootstrap:

弹出窗口如何触发-点击|悬停|焦点|手动。你可以传递多个触发器;用一个空格把它们分开。手动不能与任何其他触发器结合使用。

然而，由于未知的原因，同时使用点击和聚焦并不适合我，相反，我必须手动切换它。

这基本上不是很复杂，但有一些检查要做，以避免故障。

演示(jsfiddle)

var $poped = $('someselector');

// Trigger for the popover
$poped.each(function() {
    var $this = $(this);
    $this.on('hover',function() {
            var popover = $this.data('popover');
            var shown = popover && popover.tip().is(':visible');
            if(shown) return;        // Avoids flashing
            $this.popover('show');
    });
});

// Trigger for the hiding
 $('html').on('click.popover.data-api',function() {
    $poped.popover('hide');
});

我找到了一个解决这个问题的好方法。 通过这种方式，我们只在需要时激活事件侦听器。 此外，我们没有弹窗不出现的问题，因为 事件解除弹出窗口正在同时开火。

将弹出窗口添加到HTML中

   <input id="popoverId" type="text" data-toggle="popover" data-trigger="manual" data-content="Popover content">

当你需要时显示弹出窗口。

$('#popoverId').popover('show');

将这个侦听器添加到Javascript中。这个侦听器将在弹出窗口显示时立即启动 并将一个侦听器附加到将隐藏 当用户单击页面主体的任何位置时弹出窗口，然后删除事件侦听器，直到弹出窗口再次显示。

$('#popoverId').on('shown.bs.popover', function () {
    $('body').click(function () {
        $('#popoverId').popover('hide');
        $('body').off();
    });
});

引导5更新:

$(document).on('click', function (e) {
    var
        $popover,
        $target = $(e.target);

    //do nothing if there was a click on popover content
    if ($target.hasClass('popover') || $target.closest('.popover').length) {
        return;
    }

    $('[data-bs-toggle="popover"]').each(function () {
        $popover = $(this);

        if (!$popover.is(e.target) &&
            $popover.has(e.target).length === 0 &&
            $('.popover').has(e.target).length === 0)
        {
            $popover.popover('hide');
        } 
    });
})