javascript - IE8 中的引导弹出框（位置：'top'）行为不正确

Question

这是弹出部分的javascript代码：

$('#view_case).popover({
    html: true,
    placement: 'top',
    title: 'Test Cases',
    content: function() {
        return $('#case_list').html();
    }
});

以及来自 IE8 的截图：

按钮上方有一个小的白色三角形，它不应该在那里。

我注意到Bootstrap 的教程页面也有同样的问题。但是当位置“正确”时，它在 IE8 中运行良好。

那么这是一个常见的错误吗？我们有一些解决方法吗？

Answer 1

我已经用 IE8 测试了这个例子，它运行良好：

HTML：

<p>
    <a rel="popover" title="Here It Is" data-content="This is it!" href="http://twitter.github.com/bootstrap/index.html" target="_blank">
        Learn more about Bootstrap
    </a>
</p>

Javascript：

$('a').popover({
    placement: 'top',
    trigger: "hover"
});

你可以在这里试试。

即使放置“正确”并且也出现在 Firefox 上，您提到的三角形仍然存在，尽管与弹出框背景的颜色相同。所以这是一个错误。

Answer 2

用这个替换你的 Jquery 声明，你错过了一个逗号： -

$('#view_case').popover({
    html: true,
    placement: 'top',
    title: 'Test Cases',
    content: function() {
        return $('#case_list').html();
    }
});

Answer 3

我在带有双标注箭头指针的 IE8 浏览器中遇到了引导弹出框（位于左侧）的问题（不适用于具有浏览模式 IE8 和文档模式 IE8 标准的 IE9）。

我可以用 IE8 后备支持 CSS 来解决这个问题

.popover .arrow { 
    margin-right: 10px !important; /* adjusting the right position */
    border: 1px transparent; /* setting border to transparent */
}

希望这会有所帮助。