我们能得到弹窗被解雇的方式一样的情态动词,即。使他们关闭时,用户点击以外的地方?
不幸的是,我不能用真实的模态来代替弹窗,因为模态意味着位置:固定,那样就没有弹窗了。:(
我们能得到弹窗被解雇的方式一样的情态动词,即。使他们关闭时,用户点击以外的地方?
不幸的是,我不能用真实的模态来代替弹窗,因为模态意味着位置:固定,那样就没有弹窗了。:(
当前回答
这个解决方案摆脱了烦人的第二次点击时,显示弹出窗口的第二次
使用Bootstrap v3.3.7进行测试
$('body').on('click', function (e) {
$('.popover').each(function () {
var popover = $(this).data('bs.popover');
if (!popover.$element.is(e.target)) {
popover.inState.click = false;
popover.hide();
}
});
});
其他回答
我想到了这个: 我的场景是在同一个页面上包含更多弹窗,隐藏它们只是让它们不可见,因此,点击弹窗后面的项目是不可能的。 这个想法是将特定的弹出窗口链接标记为“活动”,然后你可以简单地“切换”活动弹出窗口。这样做将完全关闭弹窗 $ (' .popover-link ')。弹出窗口({HTML: true,容器:'body'})
$('.popover-link').popover().on 'shown.bs.popover', ->
$(this).addClass('toggled')
$('.popover-link').popover().on 'hidden.bs.popover', ->
$(this).removeClass('toggled')
$("body").on "click", (e) ->
$openedPopoverLink = $(".popover-link.toggled")
if $openedPopoverLink.has(e.target).length == 0
$openedPopoverLink.popover "toggle"
$openedPopoverLink.removeClass "toggled"
$(document).on('click', function(e) {
$('[data-toggle="popover"]').each(function() {
if (!$(this).is(e.target) && $(this).has(e.target).length === 0 && $('.popover').has(e.target).length === 0) {
$(this).popover('hide').data('bs.popover').inState.click = false
}
});
});
jQuery("#menu").click(function(){ return false; });
jQuery(document).one("click", function() { jQuery("#menu").fadeOut(); });
$("body").find('.popover').removeClass('in');
Bootstrap原生支持:
JS Bin演示
在下次单击时取消所需的特定标记 为了实现适当的跨浏览器和跨平台行为,必须使用<a>标记,而不是<button>标记,并且还必须包括role="button"和tabindex属性。