对于可能需要它的任何人来说,这是一个完整的解决方案,到目前为止,我已经用它取得了不错的效果
JS:
$(".btn-popover-container").each(function() {
var btn = $(this).children(".popover-btn");
var titleContainer = $(this).children(".btn-popover-title");
var contentContainer = $(this).children(".btn-popover-content");
var title = $(titleContainer).html();
var content = $(contentContainer).html();
$(btn).popover({
html: true,
title: title,
content: content,
placement: 'right'
});
});
HTML:
<div class="btn-popover-container">
<button type="button" class="btn btn-link popover-btn">Button Name</button>
<div class="btn-popover-title">
Popover Title
</div>
<div class="btn-popover-content">
<form>
Or Other content..
</form>
</div>
</div>
CSS:
.btn-popover-container {
display: inline-block;
}
.btn-popover-container .btn-popover-title, .btn-popover-container .btn-popover-content {
display: none;
}