Question

更改选择输入时3需要显示/更改弹出窗口。其中两个popovers工作正常。然而第三个出现在容器div的顶部，它的元素就在。

<div id='tab2'>
  <div id='leftcol'>
    <label>for select</label>
    <select>...</select>
    <label>for select</label>
    <select>...</select>
    <div id="casestrengthpop" class="popholder" rel="popover" data-content="" data-html='true' data-placement='bottom'></div>
  </div>
</div>

这些都不是前面提到的选择，这显示了不起作用的弹出窗口。

$.post(url, function(json){
        if (json != '[]'){
            popdata = JSON.parse(json);
            if(popdata.aol_info != ''){     $('#subaolpop').attr('data-content',        popdata.aol_info).popover('show');}
            if(popdata.asset_info != ''){   $('#subaolassetpop').attr('data-content',   popdata.asset_info).popover('show');}
            if(popdata.very_weak_case != ''){
                var strStrength = '<b>Very Weak Case:</b> '+popdata.very_weak_case;
                strStrength += '<br /><b>Weak Case:</b> '+popdata.weak_case;
                ...
                $('#casestrengthpop').attr('data-content',  strStrength).popover('show');
            }
        }else{
            hideallpops();  
            console.log("No Popover data available");
        }
    });

这一切都创造了正确的数据，Popovers显示，但'casestrengthpop'显示在div'leftcol'的顶部而不是它自己的div。

我尝试减少文本量，以便它绝对不会溢出leftcol的高度。

这个popover和另外两个之间的唯一区别是它们的位置。它们位于不同的“tab”div中，显示设置为“block”，此“tab2”设置为“none”。

这会导致问题吗？我不明白为什么会这样？

Bootstrap Popover出现在错误的位置

0 个答案: