我们能得到弹窗被解雇的方式一样的情态动词,即。使他们关闭时,用户点击以外的地方?
不幸的是,我不能用真实的模态来代替弹窗,因为模态意味着位置:固定,那样就没有弹窗了。:(
我们能得到弹窗被解雇的方式一样的情态动词,即。使他们关闭时,用户点击以外的地方?
不幸的是,我不能用真实的模态来代替弹窗,因为模态意味着位置:固定,那样就没有弹窗了。:(
当前回答
引导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');
}
});
})
其他回答
好吧,这是我第一次尝试在stackoverflow上回答一些东西,所以这里什么都没有:P
似乎不太清楚这个功能在最新的引导程序上是否能够开箱即用(好吧,如果您愿意在用户可以单击的地方做出妥协的话。我不确定你是否必须设置“点击悬停”,但在iPad上,点击是一种切换。
最终的结果是,在桌面上,你可以悬停或点击(大多数用户都会悬停)。在触控设备上,触摸元素将使其上升,再次触摸将使其下降。当然,这与你最初的需求有一点妥协,但至少你的代码现在更干净了:)
$ (" .my-popover ") .popover ({ 触发:'点击悬停' });
$('html').on('mouseup', function(e) {
if(!$(e.target).closest('.popover').length) {
$('.popover').each(function(){
$(this.previousSibling).popover('hide');
});
}
});
这将关闭所有弹出窗口,如果你点击任何地方,除了一个弹出窗口
更新引导4.1
$("html").on("mouseup", function (e) {
var l = $(e.target);
if (l[0].className.indexOf("popover") == -1) {
$(".popover").each(function () {
$(this).popover("hide");
});
}
});
这个解决方案很有效:
$("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');
});
jQuery("#menu").click(function(){ return false; });
jQuery(document).one("click", function() { jQuery("#menu").fadeOut(); });
使用bootstrap 2.3.2,你可以将触发器设置为“focus”,它就可以工作了:
$('#el').popover({trigger:'focus'});