twitter-bootstrap 即使使用容器,Bootstrap 弹出窗口也未正确放置:'body' 设置
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/17297701/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap popover isn't placed correctly even with container: 'body' set
提问by philm5
I've got a button in a table which should toggle a popover. I have set the data-container="body"as well as I have tried it with the javascript version.
我在表格中有一个按钮,可以切换弹出窗口。我已经设置data-container="body"了 javascript 版本,并且我已经尝试过了。
My popover looks like this: (I have clicked the first button)
我的弹窗看起来像这样:(我点击了第一个按钮)


My button code is here:
我的按钮代码在这里:
<button id="testsettracesBtn1" class="btn btn-large btn-danger" data-toggle="popover" title="" data-content="And here's some amazing content. It's very engaging. right?" data-original-title="A Title">Click to toggle popover</button>
And here my javascript:
这里是我的 javascript:
<script type="text/javascript">
$("#testsettracesBtn1").popover({ container: 'body'});
</script>
How can i achieve it to place my popover right? (And yes I have the newest bootstrap version.)
我怎样才能实现它来正确放置我的弹出框?(是的,我有最新的引导程序版本。)
采纳答案by philm5
This strange behaviour is caused because of many selectelements in within my table. I don't know why? I just changed the width of the popover to max-width, after the button is being clicked. With the correct width also the arrow is positioned right:
这种奇怪的行为是由于select我的表中的许多元素引起的。我不知道为什么?max-width单击按钮后,我只是将弹出窗口的宽度更改为。使用正确的宽度,箭头也位于右侧:
$(document).ready(function(){
$("[id^=kommentareBtn-]").popover({ container: 'body', placement: 'bottom', html: true });
//this fixed my problem...
$("[id^=kommentareBtn-]").click(function() {
$(".popover").css("width", "276px");
});
});
回答by ktm5124
I had the same problem, but the source of the bug was that my Bootstrap framework was outdated. I upgraded to 2.3.2 and the container: 'body'attribute started working.
我遇到了同样的问题,但错误的根源是我的 Bootstrap 框架已经过时了。我升级到 2.3.2 并且该container: 'body'属性开始工作。
It caused me quite a headache... until I found out the problem was not in my own code!
这让我很头疼……直到我发现问题不在我自己的代码中!

