隐藏显示的引导程序弹出窗口后需要单击两次

She*_*ang 47 jquery twitter-bootstrap

$('#popoverlink').popover();

$("#popoverhide").click(function() {
   $("#popoverlink").popover("hide"); 
});
Run Code Online (Sandbox Code Playgroud)
#popoverlink {
    position: absolute;
    top: 100px;
    left: 100px;
}
Run Code Online (Sandbox Code Playgroud)
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<a href="#" id="popoverlink" class="btn" rel="popover" title="Some title">Popover</a>
<a href="#" id="popoverhide" class="btn" rel="popover" title="Some title">hide</a>
Run Code Online (Sandbox Code Playgroud)

小提琴相同.对不起前一个链接错了.这个是正确的.

隐藏显示的弹出窗口后,我需要再次单击弹出窗口触发器以再次显示它.

这是一个错误吗?有什么可以避免的吗?

更新 我的意思是我用另一个按钮来隐藏一个弹出窗口

$("#popoverTrigger").popover("hide");
Run Code Online (Sandbox Code Playgroud)

我需要两次单击"#popoverTrigger"来显示它.

愚蠢的解决方案

$("popoverhide").click(function() {
    var f = false;
    if($("popoverlink").next('div.popover:visible')) {
        f = true;
        $("popoverlink").popover("hide");
    }
    if(f) {
        $("popoverlink").click();
    }
})
Run Code Online (Sandbox Code Playgroud)

还有另一个好主意吗?

Jul*_*les 90

仍未在3.3.6中修复,但我在此处找到了一个建议的解决方案:

https://github.com/twbs/bootstrap/issues/16732

https://github.com/twbs/bootstrap/pull/17702/files#diff-f3e99e0bb007ace7a370f0492b9cb5abR340

我在隐藏事件中应用了它:

$('body').on('hidden.bs.popover', function (e) {
    $(e.target).data("bs.popover").inState.click = false;
});
Run Code Online (Sandbox Code Playgroud)

这适合我.与提议的修复完全相同,它将是:

$('body').on('hidden.bs.popover', function (e) {
    $(e.target).data("bs.popover").inState = { click: false, hover: false, focus: false }
});
Run Code Online (Sandbox Code Playgroud)

注意:我使用委托弹出窗口,这就是为什么我使用$('body')引用.

对于Bootstrap 4使用_activeTrigger而不是inState:

$(e.target).data("bs.popover")._activeTrigger.click = false
Run Code Online (Sandbox Code Playgroud)

  • Bug在3.3.7中仍然存在,看起来它们一直持续到v4.此解决方案仍然有效 (4认同)
  • 哇.这真的很有用!但我有一段时间没用过这个.伤心 (2认同)

Dar*_*ney 6

我最近遇到了这个错误,这是我修复它的方式:

$('.myPopoverClass')
    .popover({
        trigger: 'manual', /* <- important, instantiates popover */
        container: 'body', /* optional */
        animation: false
    })
    .click(function(e) {
        $('.popover').not(this).hide(); /* optional, hide other popovers */
        $(this).popover('show'); /* show popover now it's setup */
        e.preventDefault();
    });
Run Code Online (Sandbox Code Playgroud)


Cpn*_*nch 5

这是v3.3.5中的一个错误:

https://github.com/twbs/bootstrap/issues/16732

现在只需使用3.3.4,直到它被修复.