Jquery 引导popover被剪裁到包含div的范围

我希望popover包含在可折叠的div中：。然而，popover似乎仅限于div的范围。有没有办法防止剪切

<a href="#toggle" data-toggle="collapse" data-target="#toggle" onClick="return false;">Toggle collapse</a>
<div id="toggle" class="collapse" style="background-color: yellow">
    Content of collapsible div. Click for popover: 
    <i class="icon-info-sign" id="info"></i>
</div>

可折叠分区的内容。单击以查看弹出窗口：

$（“#info”）.popover（{html:true，位置：'left'，标题：'popover'，内容：“
popover
已剪裁。
”}）；

添加

.collapse.in{overflow:visible}

似乎可以达到目的

编辑：以上答案仅适用于chrome

这里有一段jquery延迟添加类

     $('#toggle_link').click(function() {
    if($('#toggle').hasClass('in')){
        $('#toggle').removeClass('visible');
    }else{
        setTimeout(function() {
            $('#toggle').addClass('visible');
        }, 1000);
    }
});   

这个解决方案有效

---

使用计时器总是一件冒险的事情。我使用了Mike Lucid的一个变体，它监听可折叠事件，显示和隐藏

代码如下：

$(document).ready(function(){
  $('#toggle')
    .on('shown', function(evnt) {
      $(evnt.target).addClass('visible');  
    })
    .on('hide', function(evnt) {
      $(evnt.target).removeClass('visible');  
    })
  ;   
});

如果您希望您的折叠表在加载时可见，请不要忘记在中将类和可见类添加到您的折叠表div

编辑

从Bootstrap 2.3开始，工具提示和popover有一个新的

容器

选项。如果将容器设置为“body”，则不会剪裁工具提示和弹出框

---

希望这会有所帮助。

不幸的是，这也会破坏手风琴效果，即折叠的div的内容会立即显示出来，而不是随着div的扩展而逐渐显示出来。还有别的办法吗？我已经玩了一段时间了，迈克的答案似乎是目前最好的选择。我们现在在github上有一个开放的问题，关于放置在某些元素上的popover和工具提示，我将您的小提琴添加到工具提示和popover的bug列表中-检查这个答案：（）

$(document).ready(function(){
  $('#toggle')
    .on('shown', function(evnt) {
      $(evnt.target).addClass('visible');  
    })
    .on('hide', function(evnt) {
      $(evnt.target).removeClass('visible');  
    })
  ;   
});