我们能得到弹窗被解雇的方式一样的情态动词，即。使他们关闭时，用户点击以外的地方?
不幸的是，我不能用真实的模态来代替弹窗，因为模态意味着位置:固定，那样就没有弹窗了。:(
当前回答
这个解决方案很有效:
$("body") .on('click' ,'[data-toggle="popover"]', function(e) {
e.stopPropagation();
});
$("body") .on('click' ,'.popover' , function(e) {
e.stopPropagation();
});
$("body") .on('click' , function(e) {
$('[data-toggle="popover"]').popover('hide');
});
其他回答
演示:http://jsfiddle.net/nessajtr/yxpM5/1/
var clickOver = clickOver || {};
clickOver.uniqueId = $.now();
clickOver.ClickOver = function (selector, options) {
var self = this;
//default values
var isVisible, clickedAway = false;
var callbackMethod = options.content;
var uniqueDiv = document.createElement("div");
var divId = uniqueDiv.id = ++clickOver.uniqueId;
uniqueDiv.innerHTML = options.loadingContent();
options.trigger = 'manual';
options.animation = false;
options.content = uniqueDiv;
self.onClose = function () {
$("#" + divId).html(options.loadingContent());
$(selector).popover('hide')
isVisible = clickedAway = false;
};
self.onCallback = function (result) {
$("#" + divId).html(result);
};
$(selector).popover(options);
//events
$(selector).bind("click", function (e) {
$(selector).filter(function (f) {
return $(selector)[f] != e.target;
}).popover('hide');
$(selector).popover("show");
callbackMethod(self.onCallback);
isVisible = !(clickedAway = false);
});
$(document).bind("click", function (e) {
if (isVisible && clickedAway && $(e.target).parents(".popover").length == 0) {
self.onClose();
isVisible = clickedAway = false;
} else clickedAway = true;
});
}
这是我的解。
我做了一个jsfiddle来告诉你如何做到这一点:
http://jsfiddle.net/3yHTH/
其思想是在单击按钮时显示弹出窗口，在单击按钮外时隐藏弹出窗口。
HTML
<a id="button" href="#" class="btn btn-danger">Click for popover</a>
JS
$('#button').popover({
trigger: 'manual',
position: 'bottom',
title: 'Example',
content: 'Popover example for SO'
}).click(function(evt) {
evt.stopPropagation();
$(this).popover('show');
});
$('html').click(function() {
$('#button').popover('hide');
});
jQuery("#menu").click(function(){ return false; });
jQuery(document).one("click", function() { jQuery("#menu").fadeOut(); });
只需将此属性添加到html元素，以关闭弹出窗口在下次点击。
data-trigger="focus"
参考来自https://getbootstrap.com/docs/3.3/javascript/#dismiss-on-next-click
这个派对来得太晚了……但我想分享一下 我喜欢弹窗，但是它的内置功能太少了。我写了一个引导扩展.bubble()，这就是我想要的弹窗的一切。四种解题方法。单击外部，切换链接，单击X，然后单击escape。
它会自动定位，所以永远不会离开页面。
https://github.com/Itumac/bootstrap-bubble
这不是毫无理由的自我推销……在我的生活中，我已经多次获得别人的代码，我想贡献我自己的努力。试一试，看看是否对你有用。
