【问题标题】:Twitter Bootstrap Popover: repositioning or resizing after dynamically generating data?Twitter Bootstrap Popover:动态生成数据后重新定位或调整大小?
【发布时间】:2025-12-11 17:30:01
【问题描述】:
我有几个弹出按钮,点击后会动态获取弹出信息。我能够获得相应按钮的正确信息,但很难重新定位或调整弹出窗口的大小。
[这里是链接]http://bootply.com/87953 可以看到问题所在。
为了简化我面临的问题,我修改了我的代码。
对于如何仅使用 JavaScript 重新调整弹出框大小或重新定位弹出框的任何建议表示赞赏?
【问题讨论】:
标签:
javascript
twitter-bootstrap
popover
【解决方案1】:
我找到了使用 javascript 更新弹出框属性的解决方案。在我的示例中,我通过单击按钮更新了弹出框的内容、标题和位置。你可以参考这个JSFiddle
HTML:
<div class="span1 offset1" style="margin:100px">
<a href="#" id="qoo" rel="popover" class="circle"> Click to popover</a>
<div id="content-wrapper1" class="content-wrapper"> texttttttat</div>
</div>
<input type="button" id="change_content" value="Change Popover content and placement">
JS:
$('#qoo').popover({
placement : 'right',
html : true,
delay: {
show: 500,
hide: 500
},
title:'old_title',
content: function() {
return $('#content-wrapper1').html();
}
});
$('#change_content').click(function(){
alert('Popover title, content and placement changed');
$('#qoo').popover('destroy');
$('#qoo').popover({
content:'new content',
title:'new title',
placement:'top'
});
});