jquery - 弹出窗口 : close pop over when clicked outside of pop over

Question

我正在使用 bootstrap v2.2.2。我尝试了其他一些方法(即: close popover outside popover but inside stay open 和 How to dismiss a Twitter Bootstrap popover by clicking outside? 也尝试了 Boot bandX 点击插件: https://stackoverflow.com/a/11029479/1043817 )但我无法通过这些方法让它工作。

我已经用我的页面上使用的代码的方式创建了一个 JSFiddle:http://jsfiddle.net/FYNLL/ (虽然我使用的是 v2.2.2，但 JSFiddle 使用的是 v2.0.2 中的 JS。我认为这些版本之间存在一些差异。当我在本地使用 v2.2.2 时，只有单击链接后才会显示弹出窗口.在 JSFiddle 中，它在悬停时显示。需要明确的是，我希望它在单击链接后显示，而不是在悬停时显示)

我想要完成的是每当单击弹出窗口之外的区域时隐藏弹出窗口。如果单击另一个弹出窗口链接，我希望第一个弹出窗口关闭，而单击的弹出窗口打开。

这也不是绝对必要的，但我无法得到 popover当它在 .js 文件中时工作(我尝试使用 .each() )。我真的很想摆脱 <script> $(function () { $("a[rel=popover]").popover(); });</script>来 self 的 HTML 文件。再说一遍，这并不是真正的优先事项。

Answer 1

// Universal Popupover Outside Click Close Method :)
jQuery(document).mouseup(function(e){ 
    var popocontainer = jQuery(".popover");
    if (popocontainer.has(e.target).length === 0){
        jQuery('.popover').toggleClass('in').remove();
    }
});