引导弹出窗口未关闭答案

【问题标题】：Bootstrap pop over is not closing引导弹出窗口未关闭
【发布时间】：2014-12-16 11:40:36
【问题描述】：

当单击某个按钮时，我正在使用引导弹出窗口，它会通过再次单击相同的按钮打开和关闭。

我尝试在标题旁边添加一个关闭按钮，它已经完成，但是当我点击关闭按钮时没有关闭。

我的代码：

$('#emailPopover').popover({
        placement:'right',
        trigger: 'click',
        html: true,
        title:'Voter Variables'+
             '<button type="button" id="close" class="close" onclick="$(this).popover("hide");">&times;</button>'
    });

【问题讨论】：

$(this) 在onclick 中的值是多少？肯定不是 $("#emailPopover")，只需放弃 JavaScript 以支持 data- 属性。
它也无法与 $("#emailPopover").popover('hide') 一起使用。
你嵌套引号有点太随意了...使用ChaoticNadirs建议的&quot;（和#emailPopover而不是this）。
这是我做的，但它不起作用 $('#emailPopover').popover({ placement:'right', trigger: 'click', html: true, title:'Voter Variables' + '' }) ;

标签： javascript twitter-bootstrap popover

【解决方案1】：

尝试使用&quot;，而不是像这样的引号：

$('#emailPopover').popover({
        placement:'right',
        trigger: 'click',
        html: true,
        title:'Voter Variables'+
             '<button type="button" id="close" class="close" onclick="$(&quot;#emailPopover&quot;).popover(&quot;hide&quot;);">&times;</button>'
    });

引导层示例：http://www.bootply.com/pd2qZayqju

【讨论】：

如果我用这样的弹出窗口根本就没有打开
引导版本有问题吗？
请看一下这个''
@Dura 你用的是哪个版本？
我已将您在上面评论中发布的行复制到演示中，它工作正常。您可以通过单击左侧的设置选项卡来检查 Bootply 使用的版本。看看this doc

【解决方案2】：

如果您的意图是在用户单击按钮时显示弹出框，并在用户单击其他任何位置时隐藏，请尝试trigger: 'focus' 选项。 Check out the Bootstrap example Dismiss on next click for more details.

确保将 tabindex="0" 添加到 HTML 中的按钮

HTML：

<a href="#" tabindex="0" class="btn btn-lg btn-primary" id="emailPopover">Email</a>

Javascript：

$('#emailPopover').popover({
    placement:'right',
    trigger: 'focus',
    html: true,
    title:'Voter Variables'
});

JSFiddle

【讨论】：

$('#emailPopover').popover({ placement:'right', trigger: 'click', html: true, title:'Voter Variables ' }); HTML :
如果我使用焦点，弹出窗口不会自行打开
sridhar，确保将 tabindex="0" 添加到按钮。