Question

基本上，当我在弹出窗口外单击时，我希望它隐藏它。要我删除popover，我必须单击div才能删除它。

$('[data-toggle="popover"]').popover({
    html: true,
    content: function() {
        var content = $(this).data('content-target');
        try { content = $(content).html() } catch(e) {/* Ignore */}
        return content || $(this).data('content');
    }
});

我尝试添加：

$(document).click(function (e) {
    if (($('.popover').has(e.target).length == 0) || $(e.target).is('.close')) {
        $('#popover').popover('hide');
    }
});

但它不起作用..我当前的popover如下：

<a data-toggle="popover" data-title="Popover Title" data-content="<?php echo stripslashes($row['details']); ?>

Answer 1

你是否正在使用bootstrap？如果是，您可以获取最新版本，只需执行此操作：

$('.popover').popover({
    trigger: 'focus'
})

参见＆＃34; Dismissable Popover＆＃34;在bootstrap website。

Answer 2

请找到附带解决方案的小提琴：

http://jsfiddle.net/nysHH/

我认为问题还在于块$('#popover').popover('hide'); - 我用[data-toggle="popover"]选择器替换它，因为这是产生弹出窗口的元素。
此外，如果在文档单击时添加隐藏弹出窗口的事件，则只要单击[data-toggle="popover"]，事件就会触发并且弹出窗口根本不会出现。解决方法是检查popover是否可见，或者（我已经使用过）检查您点击的目标是否不是[data-toggle="popover"]

popover，点击并隐藏

2 个答案: