Bootstrap popover中的链接不起作用

Question

我有一个带有焦点触发器的弹出窗口和弹出窗口中的链接.

HTML:

<div class="tree">
    <div class="html-popup">
        Popup text <a href="http://www.google.com" target="_top">Link somewhere</a>
    </div>
    <a tabindex="0" role="button" data-container="body" data-toggle="popover" data-trigger="focus" data-placement="bottom">
        Text that has a popover
    </a>
</div>

JavaScript的:

$('.tree [data-toggle="popover"  ]').popover({
    html: true,
    content: function () {
        return $(this).prev().html();
    }
});

这是一个实时示例:JSFiddle

在Chrome中,链接在弹出窗口关闭之前打开,但在IE和Firefox中它只是关闭弹出窗口.

我必须支持IE9和相当新版本的Firefox.如何在弹出窗口关闭之前打开链接？

谢谢!

Answer 1

我猜这个问题是因为你使用了data-trigger="focus". 当您单击弹出窗口中的链接时，会触发“焦点”，然后弹出窗口关闭。此时，点击链接事件无法执行。我通过点击弹出窗口后延迟隐藏弹出窗口解决了这个问题。

例子： $('[data-toggle=popover]').popover({ delay: { hide: 200 } });

Answer 2

从目标内部标记中删除下划线.它将在IE中正常工作

    <div class="tree">
    <div class="html-popup"> Popup text <a href="http://www.google.com"   target="top">Link somewhere</a>
    </div>
<a tabindex="0" role="button" data-container="body" data-toggle="popover" data-trigger="focus" data-placement="bottom">
Text that has a popover</a>
</div>

Answer 3

您是否仅在jsfiddle中尝试过此代码？

如果是这样，则发生这种情况是因为这种虚拟环境使用 iframe 工作，而大多数浏览器出于安全原因不允许重定向。删除“目标”属性，您将收到以下控制台错误：

X-Frame-Options 拒绝加载： https: //www.google.com.br/不允许跨源框架。

如果您在 iframe 内工作，一个不错的选择是更改为target="_blank"否则它应该可以工作。